@ngx-smz/ui-kit 21.9.0-next.3 → 21.9.0-next.5

package/fesm2022/ngx-smz-ui-kit.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { signal, input, booleanAttribute, computed, Directive, inject, TemplateRef, HostAttributeToken, ChangeDetectionStrategy, Component, ElementRef, output, forwardRef, Injector, DestroyRef, afterNextRender, Renderer2, effect, InjectionToken, viewChild, ViewContainerRef, Injectable, model, contentChildren, contentChild } from '@angular/core';
+import { signal, input, booleanAttribute, computed, Directive, inject, TemplateRef, HostAttributeToken, ChangeDetectionStrategy, Component, ElementRef, afterEveryRender, output, forwardRef, Injector, DestroyRef, afterNextRender, Renderer2, effect, InjectionToken, viewChild, ViewContainerRef, Injectable, model, contentChildren, contentChild } from '@angular/core';
 import { Overlay } from '@angular/cdk/overlay';
 import { ComponentPortal, TemplatePortal } from '@angular/cdk/portal';
 import * as i1 from '@angular/forms';
@@ -644,18 +644,32 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImpor
 /** Area de texto. Substitui o `pTextarea` / `pInputTextarea` do PrimeNG. */
 class SmzTextareaDirective {
     invalid = input(false, { ...(ngDevMode ? { debugName: "invalid" } : {}), transform: booleanAttribute });
+    /** Cresce com o conteudo (equivale ao `autoResize` do `pTextarea`). */
+    autoResize = input(false, { ...(ngDevMode ? { debugName: "autoResize" } : {}), transform: booleanAttribute });
+    el = inject(ElementRef);
+    constructor() {
+        afterEveryRender(() => this.resize());
+    }
+    resize() {
+        if (!this.autoResize())
+            return;
+        const textarea = this.el.nativeElement;
+        textarea.style.overflow = 'hidden';
+        textarea.style.height = 'auto';
+        textarea.style.height = `${textarea.scrollHeight}px`;
+    }
     staticClass = smzStaticHostClass();
     classes = computed(() => smzMergeClasses(textareaClasses({ invalid: String(this.invalid()) }), this.staticClass), ...(ngDevMode ? [{ debugName: "classes" }] : []));
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SmzTextareaDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.1", type: SmzTextareaDirective, isStandalone: true, selector: "textarea[smzTextarea]", inputs: { invalid: { classPropertyName: "invalid", publicName: "invalid", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "classes()", "attr.aria-invalid": "invalid() || null" } }, ngImport: i0 });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.1", type: SmzTextareaDirective, isStandalone: true, selector: "textarea[smzTextarea]", inputs: { invalid: { classPropertyName: "invalid", publicName: "invalid", isSignal: true, isRequired: false, transformFunction: null }, autoResize: { classPropertyName: "autoResize", publicName: "autoResize", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "input": "resize()" }, properties: { "class": "classes()", "attr.aria-invalid": "invalid() || null" } }, ngImport: i0 });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SmzTextareaDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: 'textarea[smzTextarea]',
-                    host: { '[class]': 'classes()', '[attr.aria-invalid]': 'invalid() || null' },
+                    host: { '[class]': 'classes()', '[attr.aria-invalid]': 'invalid() || null', '(input)': 'resize()' },
                 }]
-        }], propDecorators: { invalid: [{ type: i0.Input, args: [{ isSignal: true, alias: "invalid", required: false }] }] } });
+        }], ctorParameters: () => [], propDecorators: { invalid: [{ type: i0.Input, args: [{ isSignal: true, alias: "invalid", required: false }] }], autoResize: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoResize", required: false }] }] } });
 
 /**
  * Checkbox do ui-kit. Substitui o `p-checkbox` do PrimeNG.
@@ -665,6 +679,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImpor
  */
 class SmzCheckboxComponent extends SmzValueAccessor {
     label = input('', ...(ngDevMode ? [{ debugName: "label" }] : []));
+    inputId = input('', ...(ngDevMode ? [{ debugName: "inputId" }] : []));
     /** Valor deste item quando o modelo e um array (modo grupo). */
     value = input(undefined, ...(ngDevMode ? [{ debugName: "value" }] : []));
     /** Forca o modo booleano mesmo com `value` informado. Mantido por compatibilidade com o Prime. */
@@ -691,7 +706,7 @@ class SmzCheckboxComponent extends SmzValueAccessor {
         this.changed.emit({ checked: this.checked(), value: this.current() });
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SmzCheckboxComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.1", type: SmzCheckboxComponent, isStandalone: true, selector: "ui-checkbox", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, binary: { classPropertyName: "binary", publicName: "binary", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { changed: "changed" }, host: { classAttribute: "inline-flex" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => SmzCheckboxComponent), multi: true }], usesInheritance: true, ngImport: i0, template: `
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.1", type: SmzCheckboxComponent, isStandalone: true, selector: "ui-checkbox", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, binary: { classPropertyName: "binary", publicName: "binary", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { changed: "changed" }, host: { classAttribute: "inline-flex" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => SmzCheckboxComponent), multi: true }], usesInheritance: true, ngImport: i0, template: `
     <label
       class="inline-flex items-center gap-2 font-ui text-ui-md text-ui-fg"
       [class]="isDisabled() ? 'cursor-not-allowed opacity-50' : 'cursor-pointer'"
@@ -699,6 +714,7 @@ class SmzCheckboxComponent extends SmzValueAccessor {
       <input
         type="checkbox"
         class="peer sr-only"
+        [attr.id]="inputId() || null"
         [name]="name()"
         [checked]="checked()"
         [disabled]="isDisabled()"
@@ -737,6 +753,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImpor
       <input
         type="checkbox"
         class="peer sr-only"
+        [attr.id]="inputId() || null"
         [name]="name()"
         [checked]="checked()"
         [disabled]="isDisabled()"
@@ -760,7 +777,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImpor
     </label>
   `,
                 }]
-        }], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], binary: [{ type: i0.Input, args: [{ isSignal: true, alias: "binary", required: false }] }], name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }], changed: [{ type: i0.Output, args: ["changed"] }] } });
+        }], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], inputId: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputId", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], binary: [{ type: i0.Input, args: [{ isSignal: true, alias: "binary", required: false }] }], name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }], changed: [{ type: i0.Output, args: ["changed"] }] } });
 
 /**
  * Radio do ui-kit. Substitui o `p-radiobutton` do PrimeNG.
@@ -1857,6 +1874,15 @@ class SmzDialogComponent {
     style = input(null, ...(ngDevMode ? [{ debugName: "style" }] : []));
     styleClass = input('', ...(ngDevMode ? [{ debugName: "styleClass" }] : []));
     baseZIndex = input(0, ...(ngDevMode ? [{ debugName: "baseZIndex" }] : []));
+    /** Permite arrastar pelo cabecalho. */
+    draggable = input(false, { ...(ngDevMode ? { debugName: "draggable" } : {}), transform: booleanAttribute });
+    /** Mostra a alca nativa de redimensionar no canto inferior direito. */
+    resizable = input(false, { ...(ngDevMode ? { debugName: "resizable" } : {}), transform: booleanAttribute });
+    /** Mostra o botao de maximizar no cabecalho padrao (com `smzTemplate="header"` use `maximize()`). */
+    maximizable = input(false, { ...(ngDevMode ? { debugName: "maximizable" } : {}), transform: booleanAttribute });
+    maximized = model(false, ...(ngDevMode ? [{ debugName: "maximized" }] : []));
+    /** Posicao na tela (como o `position` do `p-dialog`). */
+    position = input('center', ...(ngDevMode ? [{ debugName: "position" }] : []));
     shown = output();
     hidden = output();
     panel = viewChild.required('panel');
@@ -1867,6 +1893,8 @@ class SmzDialogComponent {
     viewContainer = inject(ViewContainerRef);
     host = inject(ElementRef);
     overlayRef;
+    dx = signal(0, ...(ngDevMode ? [{ debugName: "dx" }] : []));
+    dy = signal(0, ...(ngDevMode ? [{ debugName: "dy" }] : []));
     constructor() {
         effect(() => {
             if (this.visible())
@@ -1874,6 +1902,51 @@ class SmzDialogComponent {
             else
                 this.dispose();
         });
+        effect(() => {
+            const position = this.position();
+            this.overlayRef?.updatePositionStrategy(this.strategyFor(position));
+        });
+    }
+    /** Alterna entre maximizado e normal. */
+    maximize() {
+        this.maximized.update((value) => !value);
+        this.dx.set(0);
+        this.dy.set(0);
+    }
+    startDrag(event) {
+        if (!this.draggable() || this.maximized() || event.target.closest('button'))
+            return;
+        event.preventDefault();
+        const startX = event.clientX - this.dx();
+        const startY = event.clientY - this.dy();
+        const move = (e) => {
+            this.dx.set(e.clientX - startX);
+            this.dy.set(e.clientY - startY);
+        };
+        const up = () => {
+            document.removeEventListener('pointermove', move);
+            document.removeEventListener('pointerup', up);
+        };
+        document.addEventListener('pointermove', move);
+        document.addEventListener('pointerup', up);
+    }
+    strategyFor(position) {
+        const strategy = this.overlay.position().global();
+        const horizontal = position.includes('left') ? 'left' : position.includes('right') ? 'right' : 'center';
+        const vertical = position.startsWith('top') ? 'top' : position.startsWith('bottom') ? 'bottom' : position === 'left' || position === 'right' || position === 'center' ? 'center' : 'center';
+        if (horizontal === 'left')
+            strategy.left('0');
+        else if (horizontal === 'right')
+            strategy.right('0');
+        else
+            strategy.centerHorizontally();
+        if (vertical === 'top')
+            strategy.top('0');
+        else if (vertical === 'bottom')
+            strategy.bottom('0');
+        else
+            strategy.centerVertically();
+        return strategy;
     }
     close() {
         this.visible.set(false);
@@ -1887,7 +1960,7 @@ class SmzDialogComponent {
         const modal = this.modal();
         this.overlayRef = this.overlay.create({
             hasBackdrop: modal,
-            positionStrategy: this.overlay.position().global().centerHorizontally().centerVertically(),
+            positionStrategy: this.strategyFor(this.position()),
             scrollStrategy: this.overlay.scrollStrategies.block(),
         });
         SmzZIndex.set('modal', this.overlayRef.hostElement, 1100 + this.baseZIndex());
@@ -1919,24 +1992,33 @@ class SmzDialogComponent {
             this.overlayRef?.overlayElement.querySelector('[role="dialog"]')?.setAttribute('data-testid', testId);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SmzDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.1", type: SmzDialogComponent, isStandalone: true, selector: "ui-dialog", inputs: { visible: { classPropertyName: "visible", publicName: "visible", isSignal: true, isRequired: false, transformFunction: null }, header: { classPropertyName: "header", publicName: "header", isSignal: true, isRequired: false, transformFunction: null }, modal: { classPropertyName: "modal", publicName: "modal", isSignal: true, isRequired: false, transformFunction: null }, closable: { classPropertyName: "closable", publicName: "closable", isSignal: true, isRequired: false, transformFunction: null }, dismissableMask: { classPropertyName: "dismissableMask", publicName: "dismissableMask", isSignal: true, isRequired: false, transformFunction: null }, closeOnEscape: { classPropertyName: "closeOnEscape", publicName: "closeOnEscape", isSignal: true, isRequired: false, transformFunction: null }, style: { classPropertyName: "style", publicName: "style", isSignal: true, isRequired: false, transformFunction: null }, styleClass: { classPropertyName: "styleClass", publicName: "styleClass", isSignal: true, isRequired: false, transformFunction: null }, baseZIndex: { classPropertyName: "baseZIndex", publicName: "baseZIndex", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { visible: "visibleChange", shown: "shown", hidden: "hidden" }, queries: [{ propertyName: "templates", predicate: SmzTemplateDirective, isSignal: true }], viewQueries: [{ propertyName: "panel", first: true, predicate: ["panel"], descendants: true, isSignal: true }], ngImport: i0, template: `
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.1", type: SmzDialogComponent, isStandalone: true, selector: "ui-dialog", inputs: { visible: { classPropertyName: "visible", publicName: "visible", isSignal: true, isRequired: false, transformFunction: null }, header: { classPropertyName: "header", publicName: "header", isSignal: true, isRequired: false, transformFunction: null }, modal: { classPropertyName: "modal", publicName: "modal", isSignal: true, isRequired: false, transformFunction: null }, closable: { classPropertyName: "closable", publicName: "closable", isSignal: true, isRequired: false, transformFunction: null }, dismissableMask: { classPropertyName: "dismissableMask", publicName: "dismissableMask", isSignal: true, isRequired: false, transformFunction: null }, closeOnEscape: { classPropertyName: "closeOnEscape", publicName: "closeOnEscape", isSignal: true, isRequired: false, transformFunction: null }, style: { classPropertyName: "style", publicName: "style", isSignal: true, isRequired: false, transformFunction: null }, styleClass: { classPropertyName: "styleClass", publicName: "styleClass", isSignal: true, isRequired: false, transformFunction: null }, baseZIndex: { classPropertyName: "baseZIndex", publicName: "baseZIndex", isSignal: true, isRequired: false, transformFunction: null }, draggable: { classPropertyName: "draggable", publicName: "draggable", isSignal: true, isRequired: false, transformFunction: null }, resizable: { classPropertyName: "resizable", publicName: "resizable", isSignal: true, isRequired: false, transformFunction: null }, maximizable: { classPropertyName: "maximizable", publicName: "maximizable", isSignal: true, isRequired: false, transformFunction: null }, maximized: { classPropertyName: "maximized", publicName: "maximized", isSignal: true, isRequired: false, transformFunction: null }, position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { visible: "visibleChange", maximized: "maximizedChange", shown: "shown", hidden: "hidden" }, queries: [{ propertyName: "templates", predicate: SmzTemplateDirective, isSignal: true }], viewQueries: [{ propertyName: "panel", first: true, predicate: ["panel"], descendants: true, isSignal: true }], ngImport: i0, template: `
     <ng-template #panel>
       <div
         role="dialog"
         aria-modal="true"
         [attr.aria-label]="header() || null"
-        class="pointer-events-auto flex max-h-[90vh] max-w-[95vw] flex-col rounded-overlay border border-ui-line bg-ui-surface-2 font-ui text-ui-fg shadow-overlay"
-        [class]="styleClass() ?? ''"
-        [ngStyle]="style()"
+        class="pointer-events-auto flex flex-col border border-ui-line bg-ui-surface-2 font-ui text-ui-fg shadow-overlay"
+        [class]="(maximized() ? 'h-screen w-screen max-h-none max-w-none rounded-none ' : 'max-h-[90vh] max-w-[95vw] rounded-overlay ') + (resizable() && !maximized() ? 'resize overflow-auto ' : '') + (styleClass() ?? '')"
+        [ngStyle]="maximized() ? null : style()"
+        [style.transform]="maximized() || (dx() === 0 && dy() === 0) ? null : 'translate(' + dx() + 'px, ' + dy() + 'px)'"
       >
         @if (headerTemplate(); as headerTpl) {
-          <div class="border-b border-ui-line px-4 py-3">
+          <div class="border-b border-ui-line px-4 py-3" [class.cursor-move]="draggable() && !maximized()" (pointerdown)="startDrag($event)">
             <ng-container [ngTemplateOutlet]="headerTpl" />
           </div>
         }
         @else if (header() || closable()) {
-          <div class="flex items-center justify-between gap-4 border-b border-ui-line px-4 py-3">
+          <div class="flex items-center justify-between gap-4 border-b border-ui-line px-4 py-3" [class.cursor-move]="draggable() && !maximized()" (pointerdown)="startDrag($event)">
             <span class="text-ui-lg font-medium">{{ header() }}</span>
+            <div class="flex items-center gap-1">
+            @if (maximizable()) {
+              <button type="button" class="inline-flex h-8 w-8 cursor-pointer items-center justify-center rounded-full text-ui-fg-muted transition-colors duration-ui hover:bg-ui-surface-3 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ui-focus" [attr.aria-label]="maximized() ? 'Restaurar' : 'Maximizar'" (click)="maximize()">
+                <svg viewBox="0 0 16 16" class="h-4 w-4" fill="none" aria-hidden="true">
+                  @if (maximized()) { <path d="M5 3h8v8M3 5h8v8H3z" stroke="currentColor" stroke-width="1.5" stroke-linejoin="round" /> } @else { <rect x="3" y="3" width="10" height="10" stroke="currentColor" stroke-width="1.5" stroke-linejoin="round" /> }
+                </svg>
+              </button>
+            }
             @if (closable()) {
               <button
                 type="button"
@@ -1949,6 +2031,7 @@ class SmzDialogComponent {
                 </svg>
               </button>
             }
+            </div>
           </div>
         }
         <div class="min-h-0 flex-1 overflow-auto p-4"><ng-content /></div>
@@ -1973,18 +2056,27 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImpor
         role="dialog"
         aria-modal="true"
         [attr.aria-label]="header() || null"
-        class="pointer-events-auto flex max-h-[90vh] max-w-[95vw] flex-col rounded-overlay border border-ui-line bg-ui-surface-2 font-ui text-ui-fg shadow-overlay"
-        [class]="styleClass() ?? ''"
-        [ngStyle]="style()"
+        class="pointer-events-auto flex flex-col border border-ui-line bg-ui-surface-2 font-ui text-ui-fg shadow-overlay"
+        [class]="(maximized() ? 'h-screen w-screen max-h-none max-w-none rounded-none ' : 'max-h-[90vh] max-w-[95vw] rounded-overlay ') + (resizable() && !maximized() ? 'resize overflow-auto ' : '') + (styleClass() ?? '')"
+        [ngStyle]="maximized() ? null : style()"
+        [style.transform]="maximized() || (dx() === 0 && dy() === 0) ? null : 'translate(' + dx() + 'px, ' + dy() + 'px)'"
       >
         @if (headerTemplate(); as headerTpl) {
-          <div class="border-b border-ui-line px-4 py-3">
+          <div class="border-b border-ui-line px-4 py-3" [class.cursor-move]="draggable() && !maximized()" (pointerdown)="startDrag($event)">
             <ng-container [ngTemplateOutlet]="headerTpl" />
           </div>
         }
         @else if (header() || closable()) {
-          <div class="flex items-center justify-between gap-4 border-b border-ui-line px-4 py-3">
+          <div class="flex items-center justify-between gap-4 border-b border-ui-line px-4 py-3" [class.cursor-move]="draggable() && !maximized()" (pointerdown)="startDrag($event)">
             <span class="text-ui-lg font-medium">{{ header() }}</span>
+            <div class="flex items-center gap-1">
+            @if (maximizable()) {
+              <button type="button" class="inline-flex h-8 w-8 cursor-pointer items-center justify-center rounded-full text-ui-fg-muted transition-colors duration-ui hover:bg-ui-surface-3 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ui-focus" [attr.aria-label]="maximized() ? 'Restaurar' : 'Maximizar'" (click)="maximize()">
+                <svg viewBox="0 0 16 16" class="h-4 w-4" fill="none" aria-hidden="true">
+                  @if (maximized()) { <path d="M5 3h8v8M3 5h8v8H3z" stroke="currentColor" stroke-width="1.5" stroke-linejoin="round" /> } @else { <rect x="3" y="3" width="10" height="10" stroke="currentColor" stroke-width="1.5" stroke-linejoin="round" /> }
+                </svg>
+              </button>
+            }
             @if (closable()) {
               <button
                 type="button"
@@ -1997,6 +2089,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImpor
                 </svg>
               </button>
             }
+            </div>
           </div>
         }
         <div class="min-h-0 flex-1 overflow-auto p-4"><ng-content /></div>
@@ -2009,7 +2102,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImpor
     </ng-template>
   `,
                 }]
-        }], ctorParameters: () => [], propDecorators: { visible: [{ type: i0.Input, args: [{ isSignal: true, alias: "visible", required: false }] }, { type: i0.Output, args: ["visibleChange"] }], header: [{ type: i0.Input, args: [{ isSignal: true, alias: "header", required: false }] }], modal: [{ type: i0.Input, args: [{ isSignal: true, alias: "modal", required: false }] }], closable: [{ type: i0.Input, args: [{ isSignal: true, alias: "closable", required: false }] }], dismissableMask: [{ type: i0.Input, args: [{ isSignal: true, alias: "dismissableMask", required: false }] }], closeOnEscape: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeOnEscape", required: false }] }], style: [{ type: i0.Input, args: [{ isSignal: true, alias: "style", required: false }] }], styleClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "styleClass", required: false }] }], baseZIndex: [{ type: i0.Input, args: [{ isSignal: true, alias: "baseZIndex", required: false }] }], shown: [{ type: i0.Output, args: ["shown"] }], hidden: [{ type: i0.Output, args: ["hidden"] }], panel: [{ type: i0.ViewChild, args: ['panel', { isSignal: true }] }], templates: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => SmzTemplateDirective), { isSignal: true }] }] } });
+        }], ctorParameters: () => [], propDecorators: { visible: [{ type: i0.Input, args: [{ isSignal: true, alias: "visible", required: false }] }, { type: i0.Output, args: ["visibleChange"] }], header: [{ type: i0.Input, args: [{ isSignal: true, alias: "header", required: false }] }], modal: [{ type: i0.Input, args: [{ isSignal: true, alias: "modal", required: false }] }], closable: [{ type: i0.Input, args: [{ isSignal: true, alias: "closable", required: false }] }], dismissableMask: [{ type: i0.Input, args: [{ isSignal: true, alias: "dismissableMask", required: false }] }], closeOnEscape: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeOnEscape", required: false }] }], style: [{ type: i0.Input, args: [{ isSignal: true, alias: "style", required: false }] }], styleClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "styleClass", required: false }] }], baseZIndex: [{ type: i0.Input, args: [{ isSignal: true, alias: "baseZIndex", required: false }] }], draggable: [{ type: i0.Input, args: [{ isSignal: true, alias: "draggable", required: false }] }], resizable: [{ type: i0.Input, args: [{ isSignal: true, alias: "resizable", required: false }] }], maximizable: [{ type: i0.Input, args: [{ isSignal: true, alias: "maximizable", required: false }] }], maximized: [{ type: i0.Input, args: [{ isSignal: true, alias: "maximized", required: false }] }, { type: i0.Output, args: ["maximizedChange"] }], position: [{ type: i0.Input, args: [{ isSignal: true, alias: "position", required: false }] }], shown: [{ type: i0.Output, args: ["shown"] }], hidden: [{ type: i0.Output, args: ["hidden"] }], panel: [{ type: i0.ViewChild, args: ['panel', { isSignal: true }] }], templates: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => SmzTemplateDirective), { isSignal: true }] }] } });
 
 const POSITIONS$2 = [
     { originX: 'start', originY: 'bottom', overlayX: 'start', overlayY: 'top', offsetY: 8 },
@@ -3811,9 +3904,11 @@ class SmzSelectButtonComponent extends SmzValueAccessor {
     /** Aceito por compatibilidade com o `p-selectbutton`; sem efeito. */
     appendTo = input(undefined, ...(ngDevMode ? [{ debugName: "appendTo" }] : []));
     changed = output();
+    /** Sem `optionLabel`/`optionValue`, opcoes-objeto com `label`/`value` sao lidas automaticamente (como no PrimeNG). */
+    sample = computed(() => (this.options() ?? [])[0], ...(ngDevMode ? [{ debugName: "sample" }] : []));
     config = computed(() => ({
-        optionLabel: this.optionLabel(),
-        optionValue: this.optionValue(),
+        optionLabel: this.optionLabel() ?? (typeof this.sample() === 'object' && this.sample() !== null && 'label' in this.sample() ? 'label' : null),
+        optionValue: this.optionValue() ?? (typeof this.sample() === 'object' && this.sample() !== null && 'value' in this.sample() ? 'value' : null),
         optionDisabled: this.optionDisabled(),
         dataKey: this.dataKey(),
     }), ...(ngDevMode ? [{ debugName: "config" }] : []));
@@ -5677,6 +5772,8 @@ class SmzInputMaskComponent extends SmzValueAccessor {
     placeholder = input('', ...(ngDevMode ? [{ debugName: "placeholder" }] : []));
     readonly = input(false, { ...(ngDevMode ? { debugName: "readonly" } : {}), transform: booleanAttribute });
     inputId = input('', ...(ngDevMode ? [{ debugName: "inputId" }] : []));
+    /** Tipo do `<input>` nativo (`text`, `tel`, `password`...). */
+    type = input('text', ...(ngDevMode ? [{ debugName: "type" }] : []));
     inputed = output();
     blurred = output();
     completed = output();
@@ -5825,10 +5922,10 @@ class SmzInputMaskComponent extends SmzValueAccessor {
         this.field().nativeElement.setSelectionRange(position, position);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SmzInputMaskComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.2.1", type: SmzInputMaskComponent, isStandalone: true, selector: "ui-input-mask", inputs: { mask: { classPropertyName: "mask", publicName: "mask", isSignal: true, isRequired: false, transformFunction: null }, slotChar: { classPropertyName: "slotChar", publicName: "slotChar", isSignal: true, isRequired: false, transformFunction: null }, characterPattern: { classPropertyName: "characterPattern", publicName: "characterPattern", isSignal: true, isRequired: false, transformFunction: null }, unmask: { classPropertyName: "unmask", publicName: "unmask", isSignal: true, isRequired: false, transformFunction: null }, autoClear: { classPropertyName: "autoClear", publicName: "autoClear", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { inputed: "inputed", blurred: "blurred", completed: "completed" }, host: { classAttribute: "flex min-w-0" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => SmzInputMaskComponent), multi: true }], viewQueries: [{ propertyName: "field", first: true, predicate: ["field"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: `
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.2.1", type: SmzInputMaskComponent, isStandalone: true, selector: "ui-input-mask", inputs: { mask: { classPropertyName: "mask", publicName: "mask", isSignal: true, isRequired: false, transformFunction: null }, slotChar: { classPropertyName: "slotChar", publicName: "slotChar", isSignal: true, isRequired: false, transformFunction: null }, characterPattern: { classPropertyName: "characterPattern", publicName: "characterPattern", isSignal: true, isRequired: false, transformFunction: null }, unmask: { classPropertyName: "unmask", publicName: "unmask", isSignal: true, isRequired: false, transformFunction: null }, autoClear: { classPropertyName: "autoClear", publicName: "autoClear", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { inputed: "inputed", blurred: "blurred", completed: "completed" }, host: { classAttribute: "flex min-w-0" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => SmzInputMaskComponent), multi: true }], viewQueries: [{ propertyName: "field", first: true, predicate: ["field"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: `
     <input
       #field
-      type="text"
+      [attr.type]="type()"
       class="h-control w-full min-w-0 rounded-control border border-ui-line-strong bg-ui-surface-1 px-control-x font-ui text-ui-md text-ui-fg transition-colors duration-ui placeholder:text-ui-fg-subtle focus:outline-none focus:ring-2 focus:ring-ui-focus disabled:cursor-not-allowed disabled:opacity-50 [&.ng-invalid.ng-dirty]:border-ui-danger"
       [attr.id]="inputId() || null"
       [attr.placeholder]="placeholder() || null"
@@ -5853,7 +5950,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImpor
                     template: `
     <input
       #field
-      type="text"
+      [attr.type]="type()"
       class="h-control w-full min-w-0 rounded-control border border-ui-line-strong bg-ui-surface-1 px-control-x font-ui text-ui-md text-ui-fg transition-colors duration-ui placeholder:text-ui-fg-subtle focus:outline-none focus:ring-2 focus:ring-ui-focus disabled:cursor-not-allowed disabled:opacity-50 [&.ng-invalid.ng-dirty]:border-ui-danger"
       [attr.id]="inputId() || null"
       [attr.placeholder]="placeholder() || null"
@@ -5868,7 +5965,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImpor
     />
   `,
                 }]
-        }], propDecorators: { mask: [{ type: i0.Input, args: [{ isSignal: true, alias: "mask", required: false }] }], slotChar: [{ type: i0.Input, args: [{ isSignal: true, alias: "slotChar", required: false }] }], characterPattern: [{ type: i0.Input, args: [{ isSignal: true, alias: "characterPattern", required: false }] }], unmask: [{ type: i0.Input, args: [{ isSignal: true, alias: "unmask", required: false }] }], autoClear: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoClear", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], inputId: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputId", required: false }] }], inputed: [{ type: i0.Output, args: ["inputed"] }], blurred: [{ type: i0.Output, args: ["blurred"] }], completed: [{ type: i0.Output, args: ["completed"] }], field: [{ type: i0.ViewChild, args: ['field', { isSignal: true }] }] } });
+        }], propDecorators: { mask: [{ type: i0.Input, args: [{ isSignal: true, alias: "mask", required: false }] }], slotChar: [{ type: i0.Input, args: [{ isSignal: true, alias: "slotChar", required: false }] }], characterPattern: [{ type: i0.Input, args: [{ isSignal: true, alias: "characterPattern", required: false }] }], unmask: [{ type: i0.Input, args: [{ isSignal: true, alias: "unmask", required: false }] }], autoClear: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoClear", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], inputId: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputId", required: false }] }], type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: false }] }], inputed: [{ type: i0.Output, args: ["inputed"] }], blurred: [{ type: i0.Output, args: ["blurred"] }], completed: [{ type: i0.Output, args: ["completed"] }], field: [{ type: i0.ViewChild, args: ['field', { isSignal: true }] }] } });
 
 /* eslint-disable max-len -- classes Tailwind nos templates */
 const DEFAULT_MEDIUM = '^(((?=.*[a-z])(?=.*[A-Z]))|((?=.*[a-z])(?=.*[0-9]))|((?=.*[A-Z])(?=.*[0-9])))(?=.{6,})';
@@ -6028,15 +6125,19 @@ class SmzColorPickerComponent extends SmzValueAccessor {
     inputId = input('', ...(ngDevMode ? [{ debugName: "inputId" }] : []));
     /** Aceito por compatibilidade com o `p-colorpicker`; sem efeito. */
     appendTo = input(undefined, ...(ngDevMode ? [{ debugName: "appendTo" }] : []));
+    /** Emitido quando o usuario escolhe uma cor (equivale ao `onChange` do `p-colorpicker`). */
+    changed = output();
     hex = computed(() => {
         const raw = (this.current() ?? '').replace('#', '');
         return /^[0-9a-fA-F]{6}$/.test(raw) ? `#${raw.toLowerCase()}` : '#000000';
     }, ...(ngDevMode ? [{ debugName: "hex" }] : []));
     onInput(event) {
-        this.commit(event.target.value.replace('#', ''));
+        const value = event.target.value.replace('#', '');
+        this.commit(value);
+        this.changed.emit({ originalEvent: event, value });
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SmzColorPickerComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.1", type: SmzColorPickerComponent, isStandalone: true, selector: "ui-color-picker", inputs: { inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: true, isRequired: false, transformFunction: null }, appendTo: { classPropertyName: "appendTo", publicName: "appendTo", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "inline-flex" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => SmzColorPickerComponent), multi: true }], usesInheritance: true, ngImport: i0, template: `
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.1", type: SmzColorPickerComponent, isStandalone: true, selector: "ui-color-picker", inputs: { inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: true, isRequired: false, transformFunction: null }, appendTo: { classPropertyName: "appendTo", publicName: "appendTo", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { changed: "changed" }, host: { classAttribute: "inline-flex" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => SmzColorPickerComponent), multi: true }], usesInheritance: true, ngImport: i0, template: `
     <input
       type="color"
       class="h-control w-12 cursor-pointer rounded-control border border-ui-line-strong bg-ui-surface-1 p-1 focus:outline-none focus:ring-2 focus:ring-ui-focus disabled:cursor-not-allowed disabled:opacity-50"
@@ -6067,7 +6168,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImpor
     />
   `,
                 }]
-        }], propDecorators: { inputId: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputId", required: false }] }], appendTo: [{ type: i0.Input, args: [{ isSignal: true, alias: "appendTo", required: false }] }] } });
+        }], propDecorators: { inputId: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputId", required: false }] }], appendTo: [{ type: i0.Input, args: [{ isSignal: true, alias: "appendTo", required: false }] }], changed: [{ type: i0.Output, args: ["changed"] }] } });
 
 /* eslint-disable max-len -- classes Tailwind nos templates */
 /**
@@ -6218,12 +6319,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImpor
 class SmzAccordionComponent {
     value = model(null, ...(ngDevMode ? [{ debugName: "value" }] : []));
     multiple = input(false, { ...(ngDevMode ? { debugName: "multiple" } : {}), transform: booleanAttribute });
+    /** Um painel foi aberto (equivale ao `onOpen` do `p-accordion`). */
+    opened = output();
+    /** Um painel foi fechado (equivale ao `onClose`). */
+    closed = output();
+    /** Aceito por compatibilidade com o `p-accordion`; sem efeito. */
+    transitionOptions = input(null, ...(ngDevMode ? [{ debugName: "transitionOptions" }] : []));
     isOpen(value) {
         const current = this.value();
         return Array.isArray(current) ? current.includes(value) : current === value;
     }
     toggle(value) {
         const open = this.isOpen(value);
+        (open ? this.closed : this.opened).emit({ value });
         if (this.multiple()) {
             const current = Array.isArray(this.value()) ? this.value() : this.value() === null ? [] : [this.value()];
             this.value.set(open ? current.filter((entry) => entry !== value) : [...current, value]);
@@ -6233,7 +6341,7 @@ class SmzAccordionComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SmzAccordionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.1", type: SmzAccordionComponent, isStandalone: true, selector: "ui-accordion", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange" }, host: { classAttribute: "block overflow-hidden rounded-control border border-ui-line font-ui text-ui-fg" }, ngImport: i0, template: '<ng-content />', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.1", type: SmzAccordionComponent, isStandalone: true, selector: "ui-accordion", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, transitionOptions: { classPropertyName: "transitionOptions", publicName: "transitionOptions", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", opened: "opened", closed: "closed" }, host: { classAttribute: "block overflow-hidden rounded-control border border-ui-line font-ui text-ui-fg" }, ngImport: i0, template: '<ng-content />', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SmzAccordionComponent, decorators: [{
             type: Component,
@@ -6243,7 +6351,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImpor
                     host: { class: 'block overflow-hidden rounded-control border border-ui-line font-ui text-ui-fg' },
                     template: '<ng-content />',
                 }]
-        }], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], multiple: [{ type: i0.Input, args: [{ isSignal: true, alias: "multiple", required: false }] }] } });
+        }], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], multiple: [{ type: i0.Input, args: [{ isSignal: true, alias: "multiple", required: false }] }], opened: [{ type: i0.Output, args: ["opened"] }], closed: [{ type: i0.Output, args: ["closed"] }], transitionOptions: [{ type: i0.Input, args: [{ isSignal: true, alias: "transitionOptions", required: false }] }] } });
 class SmzAccordionPanelComponent {
     value = input.required(...(ngDevMode ? [{ debugName: "value" }] : []));
     accordion = inject(SmzAccordionComponent);
@@ -6597,7 +6705,7 @@ class SmzPaginatorComponent {
         <button type="button" class="inline-flex h-8 min-w-8 cursor-pointer items-center justify-center rounded-control px-2 font-ui text-ui-sm text-ui-fg transition-colors duration-ui hover:bg-ui-surface-3 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ui-focus disabled:cursor-not-allowed disabled:opacity-40 disabled:hover:bg-transparent" aria-label="Pagina anterior" [disabled]="isFirst()" (click)="goTo(page() - 1)">
           <svg viewBox="0 0 16 16" class="h-4 w-4" fill="none" aria-hidden="true"><path d="M10 4L6 8l4 4" stroke="currentColor" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round" /></svg>
         </button>
-        @if (showPageLinks()) {
+        @if (showPageLinks() && totalRecords() > 0) {
           @for (link of links(); track link) {
             <button
               type="button"
@@ -6642,7 +6750,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImpor
         <button type="button" class="inline-flex h-8 min-w-8 cursor-pointer items-center justify-center rounded-control px-2 font-ui text-ui-sm text-ui-fg transition-colors duration-ui hover:bg-ui-surface-3 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ui-focus disabled:cursor-not-allowed disabled:opacity-40 disabled:hover:bg-transparent" aria-label="Pagina anterior" [disabled]="isFirst()" (click)="goTo(page() - 1)">
           <svg viewBox="0 0 16 16" class="h-4 w-4" fill="none" aria-hidden="true"><path d="M10 4L6 8l4 4" stroke="currentColor" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round" /></svg>
         </button>
-        @if (showPageLinks()) {
+        @if (showPageLinks() && totalRecords() > 0) {
           @for (link of links(); track link) {
             <button
               type="button"
@@ -7991,9 +8099,1144 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImpor
             args: [{ providedIn: 'root' }]
         }] });
 
+/* eslint-disable max-len -- classes Tailwind nos templates */
+/**
+ * Card. Substitui o `p-card` do PrimeNG.
+ * O conteudo padrao vai no corpo; `header`, `title`, `subtitle` e `footer` podem ser strings ou templates.
+ *
+ * <ui-card header="Titulo" subheader="Sub">conteudo<ng-template smzTemplate="footer">...</ng-template></ui-card>
+ */
+class SmzCardComponent {
+    /** Titulo em texto (equivale ao slot `title`). */
+    header = input('', ...(ngDevMode ? [{ debugName: "header" }] : []));
+    /** Subtitulo em texto (equivale ao slot `subtitle`). */
+    subheader = input('', ...(ngDevMode ? [{ debugName: "subheader" }] : []));
+    templates = contentChildren(SmzTemplateDirective, ...(ngDevMode ? [{ debugName: "templates" }] : []));
+    headerTemplate = computed(() => smzFindTemplate(this.templates(), 'header'), ...(ngDevMode ? [{ debugName: "headerTemplate" }] : []));
+    titleTemplate = computed(() => smzFindTemplate(this.templates(), 'title'), ...(ngDevMode ? [{ debugName: "titleTemplate" }] : []));
+    subtitleTemplate = computed(() => smzFindTemplate(this.templates(), 'subtitle'), ...(ngDevMode ? [{ debugName: "subtitleTemplate" }] : []));
+    footerTemplate = computed(() => smzFindTemplate(this.templates(), 'footer'), ...(ngDevMode ? [{ debugName: "footerTemplate" }] : []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SmzCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.1", type: SmzCardComponent, isStandalone: true, selector: "ui-card", inputs: { header: { classPropertyName: "header", publicName: "header", isSignal: true, isRequired: false, transformFunction: null }, subheader: { classPropertyName: "subheader", publicName: "subheader", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "p-card flex flex-col overflow-hidden rounded-card border border-ui-line bg-ui-surface-1 font-ui text-ui-md text-ui-fg shadow-card" }, queries: [{ propertyName: "templates", predicate: SmzTemplateDirective, isSignal: true }], ngImport: i0, template: `
+    @if (headerTemplate(); as tpl) {
+      <div class="p-card-header"><ng-container [ngTemplateOutlet]="tpl" /></div>
+    }
+    <div class="p-card-body flex flex-1 flex-col gap-2 p-5">
+      @if (titleTemplate() || header()) {
+        <div class="p-card-title text-ui-xl font-semibold">
+          @if (titleTemplate(); as tpl) { <ng-container [ngTemplateOutlet]="tpl" /> } @else { {{ header() }} }
+        </div>
+      }
+      @if (subtitleTemplate() || subheader()) {
+        <div class="p-card-subtitle text-ui-fg-muted">
+          @if (subtitleTemplate(); as tpl) { <ng-container [ngTemplateOutlet]="tpl" /> } @else { {{ subheader() }} }
+        </div>
+      }
+      <div class="p-card-content flex-1"><ng-content /></div>
+      @if (footerTemplate(); as tpl) {
+        <div class="p-card-footer"><ng-container [ngTemplateOutlet]="tpl" /></div>
+      }
+    </div>
+  `, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SmzCardComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ui-card',
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    imports: [NgTemplateOutlet],
+                    host: { class: 'p-card flex flex-col overflow-hidden rounded-card border border-ui-line bg-ui-surface-1 font-ui text-ui-md text-ui-fg shadow-card' },
+                    template: `
+    @if (headerTemplate(); as tpl) {
+      <div class="p-card-header"><ng-container [ngTemplateOutlet]="tpl" /></div>
+    }
+    <div class="p-card-body flex flex-1 flex-col gap-2 p-5">
+      @if (titleTemplate() || header()) {
+        <div class="p-card-title text-ui-xl font-semibold">
+          @if (titleTemplate(); as tpl) { <ng-container [ngTemplateOutlet]="tpl" /> } @else { {{ header() }} }
+        </div>
+      }
+      @if (subtitleTemplate() || subheader()) {
+        <div class="p-card-subtitle text-ui-fg-muted">
+          @if (subtitleTemplate(); as tpl) { <ng-container [ngTemplateOutlet]="tpl" /> } @else { {{ subheader() }} }
+        </div>
+      }
+      <div class="p-card-content flex-1"><ng-content /></div>
+      @if (footerTemplate(); as tpl) {
+        <div class="p-card-footer"><ng-container [ngTemplateOutlet]="tpl" /></div>
+      }
+    </div>
+  `,
+                }]
+        }], propDecorators: { header: [{ type: i0.Input, args: [{ isSignal: true, alias: "header", required: false }] }], subheader: [{ type: i0.Input, args: [{ isSignal: true, alias: "subheader", required: false }] }], templates: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => SmzTemplateDirective), { isSignal: true }] }] } });
+
+/* eslint-disable max-len -- classes Tailwind nos templates */
+/**
+ * Painel com cabecalho, recolhimento opcional e rodape. Substitui o `p-panel` do PrimeNG.
+ *
+ * <ui-panel header="Filtros" [toggleable]="true" [(collapsed)]="fechado">conteudo</ui-panel>
+ */
+class SmzPanelComponent {
+    header = input('', ...(ngDevMode ? [{ debugName: "header" }] : []));
+    toggleable = input(false, { ...(ngDevMode ? { debugName: "toggleable" } : {}), transform: booleanAttribute });
+    collapsed = model(false, ...(ngDevMode ? [{ debugName: "collapsed" }] : []));
+    /** Antes de alternar (cancelavel nao: apenas notifica). */
+    beforeToggle = output();
+    afterToggle = output();
+    templates = contentChildren(SmzTemplateDirective, ...(ngDevMode ? [{ debugName: "templates" }] : []));
+    headerTemplate = computed(() => smzFindTemplate(this.templates(), 'header'), ...(ngDevMode ? [{ debugName: "headerTemplate" }] : []));
+    iconsTemplate = computed(() => smzFindTemplate(this.templates(), 'icons'), ...(ngDevMode ? [{ debugName: "iconsTemplate" }] : []));
+    footerTemplate = computed(() => smzFindTemplate(this.templates(), 'footer'), ...(ngDevMode ? [{ debugName: "footerTemplate" }] : []));
+    hasHeader = computed(() => !!this.header() || !!this.headerTemplate() || this.toggleable(), ...(ngDevMode ? [{ debugName: "hasHeader" }] : []));
+    toggle(event) {
+        const next = !this.collapsed();
+        this.beforeToggle.emit({ originalEvent: event, collapsed: next });
+        this.collapsed.set(next);
+        this.afterToggle.emit({ originalEvent: event, collapsed: next });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SmzPanelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.1", type: SmzPanelComponent, isStandalone: true, selector: "ui-panel", inputs: { header: { classPropertyName: "header", publicName: "header", isSignal: true, isRequired: false, transformFunction: null }, toggleable: { classPropertyName: "toggleable", publicName: "toggleable", isSignal: true, isRequired: false, transformFunction: null }, collapsed: { classPropertyName: "collapsed", publicName: "collapsed", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { collapsed: "collapsedChange", beforeToggle: "beforeToggle", afterToggle: "afterToggle" }, host: { classAttribute: "p-panel block overflow-hidden rounded-card border border-ui-line bg-ui-surface-1 font-ui text-ui-md text-ui-fg" }, queries: [{ propertyName: "templates", predicate: SmzTemplateDirective, isSignal: true }], ngImport: i0, template: `
+    @if (hasHeader()) {
+      <div class="p-panel-header flex items-center justify-between gap-2 border-b border-ui-line bg-ui-surface-1 px-4 py-3">
+        <div class="min-w-0 flex-1 font-semibold">
+          @if (headerTemplate(); as tpl) { <ng-container [ngTemplateOutlet]="tpl" /> } @else { {{ header() }} }
+        </div>
+        <div class="flex items-center gap-1">
+          @if (iconsTemplate(); as tpl) { <ng-container [ngTemplateOutlet]="tpl" /> }
+          @if (toggleable()) {
+            <button type="button" class="inline-flex h-8 w-8 items-center justify-center rounded-full text-ui-fg-muted transition-colors duration-ui hover:bg-ui-surface-3 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ui-focus" [attr.aria-expanded]="!collapsed()" [attr.aria-label]="collapsed() ? 'Expandir' : 'Recolher'" (click)="toggle($event)">
+              <svg viewBox="0 0 16 16" class="h-4 w-4 transition-transform duration-ui" [class.rotate-180]="!collapsed()" fill="none" aria-hidden="true"><path d="M4 6l4 4 4-4" stroke="currentColor" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round" /></svg>
+            </button>
+          }
+        </div>
+      </div>
+    }
+    @if (!collapsed()) {
+      <div class="p-panel-content p-4"><ng-content /></div>
+      @if (footerTemplate(); as tpl) {
+        <div class="p-panel-footer border-t border-ui-line px-4 py-3"><ng-container [ngTemplateOutlet]="tpl" /></div>
+      }
+    }
+  `, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SmzPanelComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ui-panel',
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    imports: [NgTemplateOutlet],
+                    host: { class: 'p-panel block overflow-hidden rounded-card border border-ui-line bg-ui-surface-1 font-ui text-ui-md text-ui-fg' },
+                    template: `
+    @if (hasHeader()) {
+      <div class="p-panel-header flex items-center justify-between gap-2 border-b border-ui-line bg-ui-surface-1 px-4 py-3">
+        <div class="min-w-0 flex-1 font-semibold">
+          @if (headerTemplate(); as tpl) { <ng-container [ngTemplateOutlet]="tpl" /> } @else { {{ header() }} }
+        </div>
+        <div class="flex items-center gap-1">
+          @if (iconsTemplate(); as tpl) { <ng-container [ngTemplateOutlet]="tpl" /> }
+          @if (toggleable()) {
+            <button type="button" class="inline-flex h-8 w-8 items-center justify-center rounded-full text-ui-fg-muted transition-colors duration-ui hover:bg-ui-surface-3 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ui-focus" [attr.aria-expanded]="!collapsed()" [attr.aria-label]="collapsed() ? 'Expandir' : 'Recolher'" (click)="toggle($event)">
+              <svg viewBox="0 0 16 16" class="h-4 w-4 transition-transform duration-ui" [class.rotate-180]="!collapsed()" fill="none" aria-hidden="true"><path d="M4 6l4 4 4-4" stroke="currentColor" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round" /></svg>
+            </button>
+          }
+        </div>
+      </div>
+    }
+    @if (!collapsed()) {
+      <div class="p-panel-content p-4"><ng-content /></div>
+      @if (footerTemplate(); as tpl) {
+        <div class="p-panel-footer border-t border-ui-line px-4 py-3"><ng-container [ngTemplateOutlet]="tpl" /></div>
+      }
+    }
+  `,
+                }]
+        }], propDecorators: { header: [{ type: i0.Input, args: [{ isSignal: true, alias: "header", required: false }] }], toggleable: [{ type: i0.Input, args: [{ isSignal: true, alias: "toggleable", required: false }] }], collapsed: [{ type: i0.Input, args: [{ isSignal: true, alias: "collapsed", required: false }] }, { type: i0.Output, args: ["collapsedChange"] }], beforeToggle: [{ type: i0.Output, args: ["beforeToggle"] }], afterToggle: [{ type: i0.Output, args: ["afterToggle"] }], templates: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => SmzTemplateDirective), { isSignal: true }] }] } });
+
+/* eslint-disable max-len -- classes Tailwind nos templates */
+/**
+ * Indicador de carregamento circular. Substitui o `p-progressspinner` do PrimeNG.
+ * O tamanho vem das classes do host (ex.: `class="h-12 w-12"`); a cor, de `text-ui-primary` (herdavel).
+ *
+ * <ui-progress-spinner class="h-12 w-12" strokeWidth="4" />
+ */
+class SmzProgressSpinnerComponent {
+    strokeWidth = input(4, ...(ngDevMode ? [{ debugName: "strokeWidth" }] : []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SmzProgressSpinnerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.1", type: SmzProgressSpinnerComponent, isStandalone: true, selector: "ui-progress-spinner", inputs: { strokeWidth: { classPropertyName: "strokeWidth", publicName: "strokeWidth", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "progressbar", "aria-busy": "true" }, classAttribute: "inline-block h-10 w-10 text-ui-primary" }, ngImport: i0, template: `
+    <svg viewBox="0 0 50 50" class="h-full w-full animate-spin" fill="none" aria-hidden="true">
+      <circle cx="25" cy="25" r="20" stroke="currentColor" [attr.stroke-width]="strokeWidth()" stroke-linecap="round" stroke-dasharray="90 150" />
+    </svg>
+  `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SmzProgressSpinnerComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ui-progress-spinner',
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    host: { class: 'inline-block h-10 w-10 text-ui-primary', role: 'progressbar', 'aria-busy': 'true' },
+                    template: `
+    <svg viewBox="0 0 50 50" class="h-full w-full animate-spin" fill="none" aria-hidden="true">
+      <circle cx="25" cy="25" r="20" stroke="currentColor" [attr.stroke-width]="strokeWidth()" stroke-linecap="round" stroke-dasharray="90 150" />
+    </svg>
+  `,
+                }]
+        }], propDecorators: { strokeWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "strokeWidth", required: false }] }] } });
+
+/* eslint-disable max-len -- classes Tailwind nos templates */
+const BASE = 'relative block [&_label]:pointer-events-none [&_label]:absolute [&_label]:left-3 [&_label]:z-10 [&_label]:text-ui-fg-subtle [&_label]:transition-all [&_label]:duration-ui';
+const RESTING = '[&_label]:top-1/2 [&_label]:-translate-y-1/2 [&_label]:text-ui-md';
+const FLOATED = {
+    over: '[&_label]:-top-5 [&_label]:left-0 [&_label]:translate-y-0 [&_label]:text-ui-xs [&_label]:text-ui-fg-muted',
+    on: '[&_label]:top-0 [&_label]:left-2 [&_label]:-translate-y-1/2 [&_label]:bg-ui-surface-1 [&_label]:px-1 [&_label]:text-ui-xs [&_label]:text-ui-fg-muted',
+    in: '[&_label]:top-1.5 [&_label]:translate-y-0 [&_label]:text-ui-xs [&_label]:text-ui-fg-muted',
+};
+const IN_PADDING = '[&_input]:pt-4 [&_textarea]:pt-5 [&_[role=combobox]]:pt-4';
+/**
+ * Rotulo flutuante. Substitui o `p-floatlabel` do PrimeNG.
+ * O `<label>` projetado flutua quando o controle recebe foco ou tem valor
+ * (detectado em `input`/`textarea` e em selects do kit; use `[filled]` para forcar).
+ *
+ * <ui-float-label variant="on"><input smzInputText id="n" /><label for="n">Nome</label></ui-float-label>
+ */
+class SmzFloatLabelComponent {
+    variant = input('over', ...(ngDevMode ? [{ debugName: "variant" }] : []));
+    /** Forca o estado "preenchido" quando a deteccao automatica nao se aplica. */
+    filled = input(null, ...(ngDevMode ? [{ debugName: "filled" }] : []));
+    focused = signal(false, ...(ngDevMode ? [{ debugName: "focused" }] : []));
+    detected = signal(false, ...(ngDevMode ? [{ debugName: "detected" }] : []));
+    host = inject(ElementRef);
+    floated = computed(() => this.focused() || (this.filled() ?? this.detected()), ...(ngDevMode ? [{ debugName: "floated" }] : []));
+    classes = computed(() => {
+        const variant = this.variant();
+        return [BASE, this.floated() ? FLOATED[variant] : RESTING, variant === 'in' ? IN_PADDING : ''].join(' ');
+    }, ...(ngDevMode ? [{ debugName: "classes" }] : []));
+    constructor() {
+        afterEveryRender(() => this.check());
+    }
+    check() {
+        {
+            const root = this.host.nativeElement;
+            const field = root.querySelector('input:not([type=checkbox]):not([type=radio]), textarea');
+            const combo = root.querySelector('[role=combobox]');
+            let filled = false;
+            if (field && field.value !== '')
+                filled = true;
+            else if (combo && !field)
+                filled = !combo.querySelector('.text-ui-fg-subtle') && (combo.textContent ?? '').trim() !== '';
+            if (filled !== this.detected())
+                this.detected.set(filled);
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SmzFloatLabelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.1", type: SmzFloatLabelComponent, isStandalone: true, selector: "ui-float-label", inputs: { variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, filled: { classPropertyName: "filled", publicName: "filled", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "focusin": "focused.set(true)", "focusout": "focused.set(false); check()", "input": "check()", "change": "check()" }, properties: { "class": "classes()" } }, ngImport: i0, template: '<ng-content />', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SmzFloatLabelComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ui-float-label',
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    host: {
+                        '[class]': 'classes()',
+                        '(focusin)': 'focused.set(true)',
+                        '(focusout)': 'focused.set(false); check()',
+                        '(input)': 'check()',
+                        '(change)': 'check()',
+                    },
+                    template: '<ng-content />',
+                }]
+        }], ctorParameters: () => [], propDecorators: { variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], filled: [{ type: i0.Input, args: [{ isSignal: true, alias: "filled", required: false }] }] } });
+
+/* eslint-disable max-len -- classes Tailwind nos templates */
+/** Painel de um `ui-splitter`. O conteudo e projetado dentro da area do painel. */
+class SmzSplitterPanelComponent {
+    content = viewChild.required(TemplateRef);
+    /** Tamanho inicial em % (sobrescreve `panelSizes` do splitter). */
+    size = input(null, ...(ngDevMode ? [{ debugName: "size" }] : []));
+    minSize = input(null, ...(ngDevMode ? [{ debugName: "minSize" }] : []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SmzSplitterPanelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.2.1", type: SmzSplitterPanelComponent, isStandalone: true, selector: "ui-splitter-panel", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, minSize: { classPropertyName: "minSize", publicName: "minSize", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "content", first: true, predicate: TemplateRef, descendants: true, isSignal: true }], ngImport: i0, template: '<ng-template><ng-content /></ng-template>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SmzSplitterPanelComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ui-splitter-panel',
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    template: '<ng-template><ng-content /></ng-template>',
+                }]
+        }], propDecorators: { content: [{ type: i0.ViewChild, args: [i0.forwardRef(() => TemplateRef), { isSignal: true }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], minSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "minSize", required: false }] }] } });
+/**
+ * Divisor redimensionavel. Substitui o `p-splitter` / `p-splitterPanel` do PrimeNG.
+ *
+ * <ui-splitter layout="horizontal" [panelSizes]="[30, 70]" [minSizes]="[10, 20]">
+ *   <ui-splitter-panel>A</ui-splitter-panel><ui-splitter-panel>B</ui-splitter-panel>
+ * </ui-splitter>
+ */
+class SmzSplitterComponent {
+    layout = input('horizontal', ...(ngDevMode ? [{ debugName: "layout" }] : []));
+    panelSizes = input(null, ...(ngDevMode ? [{ debugName: "panelSizes" }] : []));
+    minSizes = input(null, ...(ngDevMode ? [{ debugName: "minSizes" }] : []));
+    resizeEnd = output();
+    panels = contentChildren(SmzSplitterPanelComponent, ...(ngDevMode ? [{ debugName: "panels" }] : []));
+    root = viewChild.required('root');
+    overrides = signal(null, ...(ngDevMode ? [{ debugName: "overrides" }] : []));
+    sizes = computed(() => {
+        const override = this.overrides();
+        if (override && override.length === this.panels().length)
+            return override;
+        const panels = this.panels();
+        const base = this.panelSizes() ?? [];
+        const explicit = panels.map((panel, i) => panel.size() ?? base[i] ?? null);
+        const known = explicit.reduce((sum, size) => sum + (size ?? 0), 0);
+        const free = explicit.filter((size) => size === null).length;
+        const share = free > 0 ? Math.max(0, 100 - known) / free : 0;
+        return explicit.map((size) => size ?? share);
+    }, ...(ngDevMode ? [{ debugName: "sizes" }] : []));
+    min(index) {
+        return this.panels()[index]?.minSize() ?? this.minSizes()?.[index] ?? 0;
+    }
+    startDrag(event, index) {
+        event.preventDefault();
+        const rect = this.root().nativeElement.getBoundingClientRect();
+        const total = this.layout() === 'horizontal' ? rect.width : rect.height;
+        const start = this.layout() === 'horizontal' ? event.clientX : event.clientY;
+        const initial = [...this.sizes()];
+        const move = (e) => {
+            const delta = (((this.layout() === 'horizontal' ? e.clientX : e.clientY) - start) / total) * 100;
+            this.resize(initial, index, delta);
+        };
+        const up = () => {
+            document.removeEventListener('pointermove', move);
+            document.removeEventListener('pointerup', up);
+            this.resizeEnd.emit({ sizes: this.sizes() });
+        };
+        document.addEventListener('pointermove', move);
+        document.addEventListener('pointerup', up);
+    }
+    onKey(event, index) {
+        const keys = this.layout() === 'horizontal' ? { dec: 'ArrowLeft', inc: 'ArrowRight' } : { dec: 'ArrowUp', inc: 'ArrowDown' };
+        if (event.key !== keys.dec && event.key !== keys.inc)
+            return;
+        event.preventDefault();
+        this.resize([...this.sizes()], index, event.key === keys.inc ? 2 : -2);
+        this.resizeEnd.emit({ sizes: this.sizes() });
+    }
+    resize(initial, index, delta) {
+        const pair = initial[index] + initial[index + 1];
+        const next = Math.min(Math.max(initial[index] + delta, this.min(index)), pair - this.min(index + 1));
+        const sizes = [...initial];
+        sizes[index] = next;
+        sizes[index + 1] = pair - next;
+        this.overrides.set(sizes);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SmzSplitterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.1", type: SmzSplitterComponent, isStandalone: true, selector: "ui-splitter", inputs: { layout: { classPropertyName: "layout", publicName: "layout", isSignal: true, isRequired: false, transformFunction: null }, panelSizes: { classPropertyName: "panelSizes", publicName: "panelSizes", isSignal: true, isRequired: false, transformFunction: null }, minSizes: { classPropertyName: "minSizes", publicName: "minSizes", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { resizeEnd: "resizeEnd" }, host: { classAttribute: "block h-full w-full overflow-hidden rounded-control border border-ui-line bg-ui-surface-1 font-ui text-ui-md text-ui-fg" }, queries: [{ propertyName: "panels", predicate: SmzSplitterPanelComponent, isSignal: true }], viewQueries: [{ propertyName: "root", first: true, predicate: ["root"], descendants: true, isSignal: true }], ngImport: i0, template: `
+    <div #root class="flex h-full w-full" [class.flex-col]="layout() === 'vertical'">
+      @for (panel of panels(); track $index; let i = $index) {
+        <div class="min-h-0 min-w-0 overflow-auto" [style.flex]="'0 0 ' + sizes()[i] + '%'" [style.width]="layout() === 'horizontal' ? sizes()[i] + '%' : null" [style.height]="layout() === 'vertical' ? sizes()[i] + '%' : null">
+          <ng-container [ngTemplateOutlet]="panel.content()" />
+        </div>
+        @if (i < panels().length - 1) {
+          <div
+            role="separator"
+            tabindex="0"
+            class="shrink-0 bg-ui-line transition-colors duration-ui hover:bg-ui-primary focus-visible:bg-ui-primary focus-visible:outline-none"
+            [class]="layout() === 'horizontal' ? 'w-1 cursor-col-resize' : 'h-1 cursor-row-resize'"
+            [attr.aria-orientation]="layout() === 'horizontal' ? 'vertical' : 'horizontal'"
+            (pointerdown)="startDrag($event, i)"
+            (keydown)="onKey($event, i)"
+          ></div>
+        }
+      }
+    </div>
+  `, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SmzSplitterComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ui-splitter',
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    imports: [NgTemplateOutlet],
+                    host: { class: 'block h-full w-full overflow-hidden rounded-control border border-ui-line bg-ui-surface-1 font-ui text-ui-md text-ui-fg' },
+                    template: `
+    <div #root class="flex h-full w-full" [class.flex-col]="layout() === 'vertical'">
+      @for (panel of panels(); track $index; let i = $index) {
+        <div class="min-h-0 min-w-0 overflow-auto" [style.flex]="'0 0 ' + sizes()[i] + '%'" [style.width]="layout() === 'horizontal' ? sizes()[i] + '%' : null" [style.height]="layout() === 'vertical' ? sizes()[i] + '%' : null">
+          <ng-container [ngTemplateOutlet]="panel.content()" />
+        </div>
+        @if (i < panels().length - 1) {
+          <div
+            role="separator"
+            tabindex="0"
+            class="shrink-0 bg-ui-line transition-colors duration-ui hover:bg-ui-primary focus-visible:bg-ui-primary focus-visible:outline-none"
+            [class]="layout() === 'horizontal' ? 'w-1 cursor-col-resize' : 'h-1 cursor-row-resize'"
+            [attr.aria-orientation]="layout() === 'horizontal' ? 'vertical' : 'horizontal'"
+            (pointerdown)="startDrag($event, i)"
+            (keydown)="onKey($event, i)"
+          ></div>
+        }
+      }
+    </div>
+  `,
+                }]
+        }], propDecorators: { layout: [{ type: i0.Input, args: [{ isSignal: true, alias: "layout", required: false }] }], panelSizes: [{ type: i0.Input, args: [{ isSignal: true, alias: "panelSizes", required: false }] }], minSizes: [{ type: i0.Input, args: [{ isSignal: true, alias: "minSizes", required: false }] }], resizeEnd: [{ type: i0.Output, args: ["resizeEnd"] }], panels: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => SmzSplitterPanelComponent), { isSignal: true }] }], root: [{ type: i0.ViewChild, args: ['root', { isSignal: true }] }] } });
+
+/* eslint-disable max-len -- classes Tailwind nos templates */
+/* eslint-disable @typescript-eslint/no-explicit-any, @typescript-eslint/no-unsafe-assignment, @typescript-eslint/no-unsafe-member-access, @typescript-eslint/no-unsafe-return, @typescript-eslint/no-unsafe-argument, @typescript-eslint/explicit-module-boundary-types */
+const ROW_BASE = 'border-b border-ui-line transition-colors duration-ui';
+/**
+ * Tabela em arvore. Substitui o `p-treeTable` do PrimeNG.
+ * Os templates `header`, `body`, `caption`, `footer`, `emptymessage` e `summary` usam `smzTemplate`;
+ * o `body` recebe `let-rowNode let-rowData="rowData" let-columns="columns"`.
+ *
+ * <ui-tree-table [value]="nodes" [columns]="cols" selectionMode="checkbox" [(selection)]="sel">
+ *   <ng-template smzTemplate="header" let-columns><tr><th *ngFor="let c of columns">{{ c.header }}</th></tr></ng-template>
+ *   <ng-template smzTemplate="body" let-rowNode let-rowData="rowData" let-columns="columns">
+ *     <tr [smzTtRow]="rowNode"><td><ui-tree-table-toggler [rowNode]="rowNode" />{{ rowData.name }}</td></tr>
+ *   </ng-template>
+ * </ui-tree-table>
+ */
+class SmzTreeTableComponent {
+    value = input([], ...(ngDevMode ? [{ debugName: "value" }] : []));
+    columns = input([], ...(ngDevMode ? [{ debugName: "columns" }] : []));
+    selectionMode = input(null, ...(ngDevMode ? [{ debugName: "selectionMode" }] : []));
+    selection = model(null, ...(ngDevMode ? [{ debugName: "selection" }] : []));
+    propagateSelectionUp = input(true, { ...(ngDevMode ? { debugName: "propagateSelectionUp" } : {}), transform: booleanAttribute });
+    propagateSelectionDown = input(true, { ...(ngDevMode ? { debugName: "propagateSelectionDown" } : {}), transform: booleanAttribute });
+    loading = input(false, { ...(ngDevMode ? { debugName: "loading" } : {}), transform: booleanAttribute });
+    scrollable = input(false, { ...(ngDevMode ? { debugName: "scrollable" } : {}), transform: booleanAttribute });
+    scrollHeight = input(null, ...(ngDevMode ? [{ debugName: "scrollHeight" }] : []));
+    emptyMessage = input('', ...(ngDevMode ? [{ debugName: "emptyMessage" }] : []));
+    tableStyleClass = input('', ...(ngDevMode ? [{ debugName: "tableStyleClass" }] : []));
+    paginator = input(false, { ...(ngDevMode ? { debugName: "paginator" } : {}), transform: booleanAttribute });
+    rows = model(10, ...(ngDevMode ? [{ debugName: "rows" }] : []));
+    first = model(0, ...(ngDevMode ? [{ debugName: "first" }] : []));
+    rowsPerPageOptions = input(null, ...(ngDevMode ? [{ debugName: "rowsPerPageOptions" }] : []));
+    sortField = model(null, ...(ngDevMode ? [{ debugName: "sortField" }] : []));
+    sortOrder = model(1, ...(ngDevMode ? [{ debugName: "sortOrder" }] : []));
+    /** Destaca a linha sob o cursor (padrao: ligado). */
+    rowHover = input(true, { ...(ngDevMode ? { debugName: "rowHover" } : {}), transform: booleanAttribute });
+    showCurrentPageReport = input(false, { ...(ngDevMode ? { debugName: "showCurrentPageReport" } : {}), transform: booleanAttribute });
+    currentPageReportTemplate = input('Mostrando {first} a {last} de {totalRecords}', ...(ngDevMode ? [{ debugName: "currentPageReportTemplate" }] : []));
+    /** Campos (de `node.data`) consultados pelo filtro global. */
+    globalFilterFields = input(null, ...(ngDevMode ? [{ debugName: "globalFilterFields" }] : []));
+    /** `lenient`: um no que casa mantem toda a sua subarvore; `strict`: so os nos que casam (e seus ancestrais). */
+    filterMode = input('lenient', ...(ngDevMode ? [{ debugName: "filterMode" }] : []));
+    nodeSelect = output();
+    nodeUnselect = output();
+    nodeExpand = output();
+    nodeCollapse = output();
+    sorted = output();
+    page = output();
+    templates = contentChildren(SmzTemplateDirective, ...(ngDevMode ? [{ debugName: "templates" }] : []));
+    headerTemplate = computed(() => smzFindTemplate(this.templates(), 'header'), ...(ngDevMode ? [{ debugName: "headerTemplate" }] : []));
+    bodyTemplate = computed(() => smzFindTemplate(this.templates(), 'body'), ...(ngDevMode ? [{ debugName: "bodyTemplate" }] : []));
+    captionTemplate = computed(() => smzFindTemplate(this.templates(), 'caption'), ...(ngDevMode ? [{ debugName: "captionTemplate" }] : []));
+    footerTemplate = computed(() => smzFindTemplate(this.templates(), 'footer'), ...(ngDevMode ? [{ debugName: "footerTemplate" }] : []));
+    emptyTemplate = computed(() => smzFindTemplate(this.templates(), 'emptymessage'), ...(ngDevMode ? [{ debugName: "emptyTemplate" }] : []));
+    summaryTemplate = computed(() => smzFindTemplate(this.templates(), 'summary'), ...(ngDevMode ? [{ debugName: "summaryTemplate" }] : []));
+    /** Os nos sao mutaveis (`expanded`, `partialSelected`); este contador forca o recalculo das linhas. */
+    version = signal(0, ...(ngDevMode ? [{ debugName: "version" }] : []));
+    filterService = inject(SmzFilterService);
+    globalFilter = signal(null, ...(ngDevMode ? [{ debugName: "globalFilter" }] : []));
+    columnFilters = signal({}, ...(ngDevMode ? [{ debugName: "columnFilters" }] : []));
+    /** Nos raiz que passam nos filtros (global e por coluna), ou `null` quando nao ha filtro ativo. */
+    get filteredNodes() {
+        return this.visibility()?.roots ?? null;
+    }
+    /** Visibilidade calculada dos filtros: quais nos aparecem e quais ancestrais expandir. */
+    visibility = computed(() => {
+        this.version();
+        const global = this.globalFilter();
+        const columns = this.columnFilters();
+        const active = Object.entries(columns).filter(([, filter]) => filter.value !== null && filter.value !== undefined && filter.value !== '');
+        if (!global?.value && active.length === 0)
+            return null;
+        const matches = (node) => {
+            for (const [field, filter] of active) {
+                const test = this.filterService.filters[filter.matchMode] ?? this.filterService.filters['contains'];
+                if (!test(SmzObjectUtils.resolveFieldData(node.data, field), filter.value))
+                    return false;
+            }
+            if (global?.value) {
+                const test = this.filterService.filters[global.matchMode] ?? this.filterService.filters['contains'];
+                const fields = this.globalFilterFields() ?? Object.keys(node.data ?? {});
+                if (!fields.some((field) => test(SmzObjectUtils.resolveFieldData(node.data, field), global.value)))
+                    return false;
+            }
+            return true;
+        };
+        const visible = new Set();
+        const expand = new Set();
+        const lenient = this.filterMode() === 'lenient';
+        const mark = (node, forced) => {
+            const self = matches(node);
+            let anyChild = false;
+            for (const child of node.children ?? []) {
+                if (mark(child, forced || (lenient && self)))
+                    anyChild = true;
+            }
+            const show = self || anyChild || forced;
+            if (show)
+                visible.add(node);
+            if (anyChild && !self)
+                expand.add(node);
+            return self || anyChild;
+        };
+        const roots = (this.value() ?? []).filter((node) => mark(node, false));
+        return { roots, visible, expand };
+    }, ...(ngDevMode ? [{ debugName: "visibility" }] : []));
+    rootCount = computed(() => this.visibility()?.roots.length ?? (this.value() ?? []).length, ...(ngDevMode ? [{ debugName: "rootCount" }] : []));
+    flatRows = computed(() => {
+        this.version();
+        const field = this.sortField();
+        const order = this.sortOrder();
+        const filter = this.visibility();
+        const out = [];
+        const sort = (nodes) => field ? [...nodes].sort((a, b) => order * compareValues(SmzObjectUtils.resolveFieldData(a.data, field), SmzObjectUtils.resolveFieldData(b.data, field))) : nodes;
+        const walk = (nodes, parent, level) => {
+            for (const node of sort(nodes)) {
+                if (filter && !filter.visible.has(node))
+                    continue;
+                out.push({ node, parent, level });
+                if ((node.expanded || filter?.expand.has(node)) && node.children?.length)
+                    walk(node.children, node, level + 1);
+            }
+        };
+        walk(this.value() ?? [], null, 0);
+        return out;
+    }, ...(ngDevMode ? [{ debugName: "flatRows" }] : []));
+    /** Linhas visiveis; com paginador, a pagina atual e calculada sobre os nos raiz. */
+    pageRows = computed(() => {
+        const all = this.flatRows();
+        if (!this.paginator())
+            return all;
+        const roots = all.filter((row) => row.level === 0);
+        const pageRoots = new Set(roots.slice(this.first(), this.first() + this.rows()).map((row) => row.node));
+        let include = false;
+        return all.filter((row) => {
+            if (row.level === 0)
+                include = pageRoots.has(row.node);
+            return include;
+        });
+    }, ...(ngDevMode ? [{ debugName: "pageRows" }] : []));
+    /** Filtro global (equivale a `filterGlobal` do `p-treeTable`). */
+    filterGlobal(value, matchMode = 'contains') {
+        this.globalFilter.set(value ? { value, matchMode } : null);
+        this.first.set(0);
+    }
+    /** Filtro de uma coluna (campo de `node.data`). Valor vazio remove o filtro. */
+    filter(value, field, matchMode = 'contains') {
+        this.columnFilters.update((current) => ({ ...current, [field]: { value, matchMode } }));
+        this.first.set(0);
+    }
+    /** Limpa filtros, ordenacao e volta para a primeira pagina (equivale a `clear()` do `p-treeTable`). */
+    clear() {
+        this.globalFilter.set(null);
+        this.columnFilters.set({});
+        this.sortField.set(null);
+        this.sortOrder.set(1);
+        this.first.set(0);
+    }
+    refresh() {
+        this.version.update((v) => v + 1);
+    }
+    toggleNode(rowNode, event) {
+        const node = rowNode.node;
+        node.expanded = !node.expanded;
+        (node.expanded ? this.nodeExpand : this.nodeCollapse).emit({ node, originalEvent: event });
+        this.refresh();
+    }
+    sortBy(field) {
+        const order = this.sortField() === field && this.sortOrder() === 1 ? -1 : 1;
+        this.sortField.set(field);
+        this.sortOrder.set(order);
+        this.sorted.emit({ field, order });
+    }
+    isSelected(node) {
+        const selection = this.selection();
+        return Array.isArray(selection) ? selection.includes(node) : selection === node;
+    }
+    selectionState(node) {
+        if (this.isSelected(node))
+            return 'checked';
+        return node.partialSelected ? 'partial' : 'unchecked';
+    }
+    onRowClick(rowNode, event) {
+        const mode = this.selectionMode();
+        const node = rowNode.node;
+        if (!mode || node.selectable === false)
+            return;
+        if (mode === 'checkbox')
+            return; // selecao so pelo checkbox
+        const selected = this.isSelected(node);
+        if (mode === 'single') {
+            this.selection.set(selected ? null : node);
+        }
+        else {
+            const current = Array.isArray(this.selection()) ? this.selection() : [];
+            this.selection.set(selected ? current.filter((entry) => entry !== node) : [...current, node]);
+        }
+        (selected ? this.nodeUnselect : this.nodeSelect).emit({ node, originalEvent: event });
+    }
+    toggleCheckbox(rowNode, event) {
+        const node = rowNode.node;
+        const selected = this.isSelected(node);
+        const set = new Set(Array.isArray(this.selection()) ? this.selection() : []);
+        const apply = (target, value) => {
+            if (value)
+                set.add(target);
+            else
+                set.delete(target);
+            target.partialSelected = false;
+            if (this.propagateSelectionDown())
+                target.children?.forEach((child) => apply(child, value));
+        };
+        apply(node, !selected);
+        if (this.propagateSelectionUp()) {
+            for (let parent = rowNode.parent; parent; parent = this.findParent(parent)) {
+                const children = parent.children ?? [];
+                const all = children.every((child) => set.has(child));
+                const some = children.some((child) => set.has(child) || child.partialSelected);
+                if (all)
+                    set.add(parent);
+                else
+                    set.delete(parent);
+                parent.partialSelected = !all && some;
+            }
+        }
+        this.selection.set([...set]);
+        (selected ? this.nodeUnselect : this.nodeSelect).emit({ node, originalEvent: event });
+        this.refresh();
+    }
+    /** Marca/desmarca todos os nos (checkbox do cabecalho). */
+    toggleAll(checked) {
+        const set = new Set();
+        const walk = (nodes) => {
+            for (const node of nodes) {
+                node.partialSelected = false;
+                if (checked && node.selectable !== false)
+                    set.add(node);
+                walk(node.children ?? []);
+            }
+        };
+        walk(this.value() ?? []);
+        this.selection.set([...set]);
+        this.refresh();
+    }
+    allSelected() {
+        const total = this.countNodes(this.value() ?? []);
+        const selection = this.selection();
+        return total > 0 && Array.isArray(selection) && selection.length >= total;
+    }
+    countNodes(nodes) {
+        return nodes.reduce((sum, node) => sum + 1 + this.countNodes(node.children ?? []), 0);
+    }
+    findParent(node) {
+        const search = (nodes, parent) => {
+            for (const candidate of nodes) {
+                if (candidate === node)
+                    return parent;
+                const found = search(candidate.children ?? [], candidate);
+                if (found !== undefined)
+                    return found;
+            }
+            return undefined;
+        };
+        return search(this.value() ?? [], null) ?? null;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SmzTreeTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.1", type: SmzTreeTableComponent, isStandalone: true, selector: "ui-tree-table", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, selectionMode: { classPropertyName: "selectionMode", publicName: "selectionMode", isSignal: true, isRequired: false, transformFunction: null }, selection: { classPropertyName: "selection", publicName: "selection", isSignal: true, isRequired: false, transformFunction: null }, propagateSelectionUp: { classPropertyName: "propagateSelectionUp", publicName: "propagateSelectionUp", isSignal: true, isRequired: false, transformFunction: null }, propagateSelectionDown: { classPropertyName: "propagateSelectionDown", publicName: "propagateSelectionDown", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, scrollable: { classPropertyName: "scrollable", publicName: "scrollable", isSignal: true, isRequired: false, transformFunction: null }, scrollHeight: { classPropertyName: "scrollHeight", publicName: "scrollHeight", isSignal: true, isRequired: false, transformFunction: null }, emptyMessage: { classPropertyName: "emptyMessage", publicName: "emptyMessage", isSignal: true, isRequired: false, transformFunction: null }, tableStyleClass: { classPropertyName: "tableStyleClass", publicName: "tableStyleClass", isSignal: true, isRequired: false, transformFunction: null }, paginator: { classPropertyName: "paginator", publicName: "paginator", isSignal: true, isRequired: false, transformFunction: null }, rows: { classPropertyName: "rows", publicName: "rows", isSignal: true, isRequired: false, transformFunction: null }, first: { classPropertyName: "first", publicName: "first", isSignal: true, isRequired: false, transformFunction: null }, rowsPerPageOptions: { classPropertyName: "rowsPerPageOptions", publicName: "rowsPerPageOptions", isSignal: true, isRequired: false, transformFunction: null }, sortField: { classPropertyName: "sortField", publicName: "sortField", isSignal: true, isRequired: false, transformFunction: null }, sortOrder: { classPropertyName: "sortOrder", publicName: "sortOrder", isSignal: true, isRequired: false, transformFunction: null }, rowHover: { classPropertyName: "rowHover", publicName: "rowHover", isSignal: true, isRequired: false, transformFunction: null }, showCurrentPageReport: { classPropertyName: "showCurrentPageReport", publicName: "showCurrentPageReport", isSignal: true, isRequired: false, transformFunction: null }, currentPageReportTemplate: { classPropertyName: "currentPageReportTemplate", publicName: "currentPageReportTemplate", isSignal: true, isRequired: false, transformFunction: null }, globalFilterFields: { classPropertyName: "globalFilterFields", publicName: "globalFilterFields", isSignal: true, isRequired: false, transformFunction: null }, filterMode: { classPropertyName: "filterMode", publicName: "filterMode", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selection: "selectionChange", rows: "rowsChange", first: "firstChange", sortField: "sortFieldChange", sortOrder: "sortOrderChange", nodeSelect: "nodeSelect", nodeUnselect: "nodeUnselect", nodeExpand: "nodeExpand", nodeCollapse: "nodeCollapse", sorted: "sorted", page: "page" }, host: { classAttribute: "block overflow-hidden rounded-control border border-ui-line bg-ui-surface-1 font-ui text-ui-md text-ui-fg" }, queries: [{ propertyName: "templates", predicate: SmzTemplateDirective, isSignal: true }], ngImport: i0, template: `
+    @if (captionTemplate(); as tpl) {
+      <div class="border-b border-ui-line px-4 py-3"><ng-container [ngTemplateOutlet]="tpl" /></div>
+    }
+    <div class="relative overflow-auto" [style.max-height]="scrollable() ? scrollHeight() : null">
+      <table class="w-full border-separate border-spacing-0 text-left [&_td]:border-b [&_td]:border-ui-line [&_td]:px-4 [&_td]:py-3 [&_th]:sticky [&_th]:top-0 [&_th]:border-b [&_th]:border-ui-line [&_th]:bg-ui-surface-1 [&_th]:px-4 [&_th]:py-3 [&_th]:font-semibold" [class]="tableStyleClass() ?? ''">
+        <thead>
+          @if (headerTemplate(); as tpl) {
+            <ng-container [ngTemplateOutlet]="tpl" [ngTemplateOutletContext]="{ $implicit: columns() }" />
+          }
+        </thead>
+        <tbody>
+          @for (row of pageRows(); track row.node.key ?? row.node) {
+            <ng-container [ngTemplateOutlet]="bodyTemplate() ?? null" [ngTemplateOutletContext]="{ $implicit: row, rowNode: row, node: row.node, rowData: row.node.data, columns: columns() }" />
+          } @empty {
+            @if (!loading()) {
+              <tr>
+                <td [attr.colspan]="columns().length || 1" class="px-4 py-6 text-center text-ui-fg-muted">
+                  @if (emptyTemplate(); as tpl) { <ng-container [ngTemplateOutlet]="tpl" [ngTemplateOutletContext]="{ $implicit: columns() }" /> } @else { {{ emptyMessage() }} }
+                </td>
+              </tr>
+            }
+          }
+        </tbody>
+        @if (footerTemplate(); as tpl) {
+          <tfoot><ng-container [ngTemplateOutlet]="tpl" [ngTemplateOutletContext]="{ $implicit: columns() }" /></tfoot>
+        }
+      </table>
+      @if (loading()) {
+        <div class="absolute inset-0 flex items-center justify-center bg-ui-surface-1/60 text-ui-primary" role="status">
+          <svg viewBox="0 0 50 50" class="h-8 w-8 animate-spin" fill="none" aria-hidden="true"><circle cx="25" cy="25" r="20" stroke="currentColor" stroke-width="4" stroke-linecap="round" stroke-dasharray="90 150" /></svg>
+        </div>
+      }
+    </div>
+    @if (paginator()) {
+      <ui-paginator class="border-t border-ui-line" [first]="first()" [rows]="rows()" [totalRecords]="rootCount()" [rowsPerPageOptions]="rowsPerPageOptions()" [showCurrentPageReport]="showCurrentPageReport()" [currentPageReportTemplate]="currentPageReportTemplate()" (firstChange)="first.set($event)" (rowsChange)="rows.set($event)" (pageChanged)="page.emit($event)" />
+    }
+    @if (summaryTemplate(); as tpl) {
+      <div class="border-t border-ui-line px-4 py-3"><ng-container [ngTemplateOutlet]="tpl" /></div>
+    }
+  `, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: SmzPaginatorComponent, selector: "ui-paginator", inputs: ["first", "rows", "totalRecords", "pageLinkSize", "rowsPerPageOptions", "showCurrentPageReport", "currentPageReportTemplate", "alwaysShow", "showPageLinks", "styleClass", "dropdownAppendTo", "showFirstLastIcon"], outputs: ["firstChange", "rowsChange", "pageChanged"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SmzTreeTableComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ui-tree-table',
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    imports: [NgTemplateOutlet, SmzPaginatorComponent],
+                    host: { class: 'block overflow-hidden rounded-control border border-ui-line bg-ui-surface-1 font-ui text-ui-md text-ui-fg' },
+                    template: `
+    @if (captionTemplate(); as tpl) {
+      <div class="border-b border-ui-line px-4 py-3"><ng-container [ngTemplateOutlet]="tpl" /></div>
+    }
+    <div class="relative overflow-auto" [style.max-height]="scrollable() ? scrollHeight() : null">
+      <table class="w-full border-separate border-spacing-0 text-left [&_td]:border-b [&_td]:border-ui-line [&_td]:px-4 [&_td]:py-3 [&_th]:sticky [&_th]:top-0 [&_th]:border-b [&_th]:border-ui-line [&_th]:bg-ui-surface-1 [&_th]:px-4 [&_th]:py-3 [&_th]:font-semibold" [class]="tableStyleClass() ?? ''">
+        <thead>
+          @if (headerTemplate(); as tpl) {
+            <ng-container [ngTemplateOutlet]="tpl" [ngTemplateOutletContext]="{ $implicit: columns() }" />
+          }
+        </thead>
+        <tbody>
+          @for (row of pageRows(); track row.node.key ?? row.node) {
+            <ng-container [ngTemplateOutlet]="bodyTemplate() ?? null" [ngTemplateOutletContext]="{ $implicit: row, rowNode: row, node: row.node, rowData: row.node.data, columns: columns() }" />
+          } @empty {
+            @if (!loading()) {
+              <tr>
+                <td [attr.colspan]="columns().length || 1" class="px-4 py-6 text-center text-ui-fg-muted">
+                  @if (emptyTemplate(); as tpl) { <ng-container [ngTemplateOutlet]="tpl" [ngTemplateOutletContext]="{ $implicit: columns() }" /> } @else { {{ emptyMessage() }} }
+                </td>
+              </tr>
+            }
+          }
+        </tbody>
+        @if (footerTemplate(); as tpl) {
+          <tfoot><ng-container [ngTemplateOutlet]="tpl" [ngTemplateOutletContext]="{ $implicit: columns() }" /></tfoot>
+        }
+      </table>
+      @if (loading()) {
+        <div class="absolute inset-0 flex items-center justify-center bg-ui-surface-1/60 text-ui-primary" role="status">
+          <svg viewBox="0 0 50 50" class="h-8 w-8 animate-spin" fill="none" aria-hidden="true"><circle cx="25" cy="25" r="20" stroke="currentColor" stroke-width="4" stroke-linecap="round" stroke-dasharray="90 150" /></svg>
+        </div>
+      }
+    </div>
+    @if (paginator()) {
+      <ui-paginator class="border-t border-ui-line" [first]="first()" [rows]="rows()" [totalRecords]="rootCount()" [rowsPerPageOptions]="rowsPerPageOptions()" [showCurrentPageReport]="showCurrentPageReport()" [currentPageReportTemplate]="currentPageReportTemplate()" (firstChange)="first.set($event)" (rowsChange)="rows.set($event)" (pageChanged)="page.emit($event)" />
+    }
+    @if (summaryTemplate(); as tpl) {
+      <div class="border-t border-ui-line px-4 py-3"><ng-container [ngTemplateOutlet]="tpl" /></div>
+    }
+  `,
+                }]
+        }], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], columns: [{ type: i0.Input, args: [{ isSignal: true, alias: "columns", required: false }] }], selectionMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectionMode", required: false }] }], selection: [{ type: i0.Input, args: [{ isSignal: true, alias: "selection", required: false }] }, { type: i0.Output, args: ["selectionChange"] }], propagateSelectionUp: [{ type: i0.Input, args: [{ isSignal: true, alias: "propagateSelectionUp", required: false }] }], propagateSelectionDown: [{ type: i0.Input, args: [{ isSignal: true, alias: "propagateSelectionDown", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], scrollable: [{ type: i0.Input, args: [{ isSignal: true, alias: "scrollable", required: false }] }], scrollHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "scrollHeight", required: false }] }], emptyMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyMessage", required: false }] }], tableStyleClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "tableStyleClass", required: false }] }], paginator: [{ type: i0.Input, args: [{ isSignal: true, alias: "paginator", required: false }] }], rows: [{ type: i0.Input, args: [{ isSignal: true, alias: "rows", required: false }] }, { type: i0.Output, args: ["rowsChange"] }], first: [{ type: i0.Input, args: [{ isSignal: true, alias: "first", required: false }] }, { type: i0.Output, args: ["firstChange"] }], rowsPerPageOptions: [{ type: i0.Input, args: [{ isSignal: true, alias: "rowsPerPageOptions", required: false }] }], sortField: [{ type: i0.Input, args: [{ isSignal: true, alias: "sortField", required: false }] }, { type: i0.Output, args: ["sortFieldChange"] }], sortOrder: [{ type: i0.Input, args: [{ isSignal: true, alias: "sortOrder", required: false }] }, { type: i0.Output, args: ["sortOrderChange"] }], rowHover: [{ type: i0.Input, args: [{ isSignal: true, alias: "rowHover", required: false }] }], showCurrentPageReport: [{ type: i0.Input, args: [{ isSignal: true, alias: "showCurrentPageReport", required: false }] }], currentPageReportTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "currentPageReportTemplate", required: false }] }], globalFilterFields: [{ type: i0.Input, args: [{ isSignal: true, alias: "globalFilterFields", required: false }] }], filterMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "filterMode", required: false }] }], nodeSelect: [{ type: i0.Output, args: ["nodeSelect"] }], nodeUnselect: [{ type: i0.Output, args: ["nodeUnselect"] }], nodeExpand: [{ type: i0.Output, args: ["nodeExpand"] }], nodeCollapse: [{ type: i0.Output, args: ["nodeCollapse"] }], sorted: [{ type: i0.Output, args: ["sorted"] }], page: [{ type: i0.Output, args: ["page"] }], templates: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => SmzTemplateDirective), { isSignal: true }] }] } });
+function compareValues(a, b) {
+    if (a == null && b == null)
+        return 0;
+    if (a == null)
+        return -1;
+    if (b == null)
+        return 1;
+    if (typeof a === 'string' && typeof b === 'string')
+        return a.localeCompare(b);
+    return a < b ? -1 : a > b ? 1 : 0;
+}
+/** Linha do corpo: `<tr [smzTtRow]="rowNode">`. Cuida de estilo, aria e selecao por clique. */
+class SmzTreeTableRowDirective {
+    table = inject(SmzTreeTableComponent);
+    rowNode = input.required({ ...(ngDevMode ? { debugName: "rowNode" } : {}), alias: 'smzTtRow' });
+    classes = computed(() => {
+        const mode = this.table.selectionMode();
+        const selected = this.table.isSelected(this.rowNode().node);
+        const hover = this.table.rowHover() ? 'hover:bg-ui-surface-3' : '';
+        const interactive = mode && mode !== 'checkbox' ? `cursor-pointer ${hover}` : hover;
+        return `${ROW_BASE} ${interactive} ${selected && mode !== 'checkbox' ? 'bg-ui-primary/10' : ''}`;
+    }, ...(ngDevMode ? [{ debugName: "classes" }] : []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SmzTreeTableRowDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.1", type: SmzTreeTableRowDirective, isStandalone: true, selector: "tr[smzTtRow]", inputs: { rowNode: { classPropertyName: "rowNode", publicName: "smzTtRow", isSignal: true, isRequired: true, transformFunction: null } }, host: { listeners: { "click": "table.onRowClick(rowNode(), $event)" }, properties: { "class": "classes()", "attr.aria-level": "rowNode().level + 1", "attr.aria-expanded": "rowNode().node.children?.length ? !!rowNode().node.expanded : null", "attr.aria-selected": "table.selectionMode() ? table.isSelected(rowNode().node) : null" } }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SmzTreeTableRowDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'tr[smzTtRow]',
+                    host: {
+                        '[class]': 'classes()',
+                        '[attr.aria-level]': 'rowNode().level + 1',
+                        '[attr.aria-expanded]': 'rowNode().node.children?.length ? !!rowNode().node.expanded : null',
+                        '[attr.aria-selected]': 'table.selectionMode() ? table.isSelected(rowNode().node) : null',
+                        '(click)': 'table.onRowClick(rowNode(), $event)',
+                    },
+                }]
+        }], propDecorators: { rowNode: [{ type: i0.Input, args: [{ isSignal: true, alias: "smzTtRow", required: true }] }] } });
+/** Seta de expandir/recolher com recuo por nivel: `<ui-tree-table-toggler [rowNode]="rowNode" />`. */
+class SmzTreeTableTogglerComponent {
+    table = inject(SmzTreeTableComponent);
+    rowNode = input.required(...(ngDevMode ? [{ debugName: "rowNode" }] : []));
+    hasChildren() {
+        const node = this.rowNode().node;
+        return !node.leaf && (node.children?.length ?? 0) > 0;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SmzTreeTableTogglerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.1", type: SmzTreeTableTogglerComponent, isStandalone: true, selector: "ui-tree-table-toggler", inputs: { rowNode: { classPropertyName: "rowNode", publicName: "rowNode", isSignal: true, isRequired: true, transformFunction: null } }, host: { properties: { "style.padding-left.rem": "rowNode().level * 1.5" }, classAttribute: "inline-flex items-center align-middle" }, ngImport: i0, template: `
+    <button type="button" class="inline-flex h-6 w-6 items-center justify-center rounded-full text-ui-fg-muted transition-colors duration-ui hover:bg-ui-surface-3 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ui-focus" [class.invisible]="!hasChildren()" [attr.aria-label]="rowNode().node.expanded ? 'Recolher' : 'Expandir'" (click)="$event.stopPropagation(); table.toggleNode(rowNode(), $event)">
+      <svg viewBox="0 0 16 16" class="h-4 w-4 transition-transform duration-ui" [class.rotate-90]="rowNode().node.expanded" fill="none" aria-hidden="true"><path d="M6 4l4 4-4 4" stroke="currentColor" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round" /></svg>
+    </button>
+  `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SmzTreeTableTogglerComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ui-tree-table-toggler',
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    host: { class: 'inline-flex items-center align-middle', '[style.padding-left.rem]': 'rowNode().level * 1.5' },
+                    template: `
+    <button type="button" class="inline-flex h-6 w-6 items-center justify-center rounded-full text-ui-fg-muted transition-colors duration-ui hover:bg-ui-surface-3 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ui-focus" [class.invisible]="!hasChildren()" [attr.aria-label]="rowNode().node.expanded ? 'Recolher' : 'Expandir'" (click)="$event.stopPropagation(); table.toggleNode(rowNode(), $event)">
+      <svg viewBox="0 0 16 16" class="h-4 w-4 transition-transform duration-ui" [class.rotate-90]="rowNode().node.expanded" fill="none" aria-hidden="true"><path d="M6 4l4 4-4 4" stroke="currentColor" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round" /></svg>
+    </button>
+  `,
+                }]
+        }], propDecorators: { rowNode: [{ type: i0.Input, args: [{ isSignal: true, alias: "rowNode", required: true }] }] } });
+/** Checkbox de selecao da linha (modo `checkbox`): `<ui-tree-table-checkbox [value]="rowNode" />`. */
+class SmzTreeTableCheckboxComponent {
+    table = inject(SmzTreeTableComponent);
+    value = input.required(...(ngDevMode ? [{ debugName: "value" }] : []));
+    state() {
+        return this.table.selectionState(this.value().node);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SmzTreeTableCheckboxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.1", type: SmzTreeTableCheckboxComponent, isStandalone: true, selector: "ui-tree-table-checkbox", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: true, transformFunction: null } }, host: { classAttribute: "inline-flex align-middle" }, ngImport: i0, template: `
+    <button type="button" role="checkbox" [attr.aria-checked]="state() === 'partial' ? 'mixed' : state() === 'checked'" class="inline-flex h-5 w-5 items-center justify-center rounded border transition-colors duration-ui focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ui-focus" [class]="state() === 'unchecked' ? 'border-ui-line-strong bg-ui-surface-1' : 'border-ui-primary bg-ui-primary text-ui-on-primary'" (click)="$event.stopPropagation(); table.toggleCheckbox(value(), $event)">
+      @if (state() === 'checked') { <svg viewBox="0 0 16 16" class="h-3 w-3" fill="none" aria-hidden="true"><path d="M3.5 8.5l3 3 6-6.5" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" /></svg> }
+      @else if (state() === 'partial') { <svg viewBox="0 0 16 16" class="h-3 w-3" fill="none" aria-hidden="true"><path d="M4 8h8" stroke="currentColor" stroke-width="2" stroke-linecap="round" /></svg> }
+    </button>
+  `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SmzTreeTableCheckboxComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ui-tree-table-checkbox',
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    host: { class: 'inline-flex align-middle' },
+                    template: `
+    <button type="button" role="checkbox" [attr.aria-checked]="state() === 'partial' ? 'mixed' : state() === 'checked'" class="inline-flex h-5 w-5 items-center justify-center rounded border transition-colors duration-ui focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ui-focus" [class]="state() === 'unchecked' ? 'border-ui-line-strong bg-ui-surface-1' : 'border-ui-primary bg-ui-primary text-ui-on-primary'" (click)="$event.stopPropagation(); table.toggleCheckbox(value(), $event)">
+      @if (state() === 'checked') { <svg viewBox="0 0 16 16" class="h-3 w-3" fill="none" aria-hidden="true"><path d="M3.5 8.5l3 3 6-6.5" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" /></svg> }
+      @else if (state() === 'partial') { <svg viewBox="0 0 16 16" class="h-3 w-3" fill="none" aria-hidden="true"><path d="M4 8h8" stroke="currentColor" stroke-width="2" stroke-linecap="round" /></svg> }
+    </button>
+  `,
+                }]
+        }], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: true }] }] } });
+/** Checkbox do cabecalho: seleciona/limpa todos os nos. */
+class SmzTreeTableHeaderCheckboxComponent {
+    table = inject(SmzTreeTableComponent);
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SmzTreeTableHeaderCheckboxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.1", type: SmzTreeTableHeaderCheckboxComponent, isStandalone: true, selector: "ui-tree-table-header-checkbox", host: { classAttribute: "inline-flex align-middle" }, ngImport: i0, template: `
+    <button type="button" role="checkbox" [attr.aria-checked]="table.allSelected()" class="inline-flex h-5 w-5 items-center justify-center rounded border transition-colors duration-ui focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ui-focus" [class]="table.allSelected() ? 'border-ui-primary bg-ui-primary text-ui-on-primary' : 'border-ui-line-strong bg-ui-surface-1'" (click)="table.toggleAll(!table.allSelected())">
+      @if (table.allSelected()) { <svg viewBox="0 0 16 16" class="h-3 w-3" fill="none" aria-hidden="true"><path d="M3.5 8.5l3 3 6-6.5" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" /></svg> }
+    </button>
+  `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SmzTreeTableHeaderCheckboxComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ui-tree-table-header-checkbox',
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    host: { class: 'inline-flex align-middle' },
+                    template: `
+    <button type="button" role="checkbox" [attr.aria-checked]="table.allSelected()" class="inline-flex h-5 w-5 items-center justify-center rounded border transition-colors duration-ui focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ui-focus" [class]="table.allSelected() ? 'border-ui-primary bg-ui-primary text-ui-on-primary' : 'border-ui-line-strong bg-ui-surface-1'" (click)="table.toggleAll(!table.allSelected())">
+      @if (table.allSelected()) { <svg viewBox="0 0 16 16" class="h-3 w-3" fill="none" aria-hidden="true"><path d="M3.5 8.5l3 3 6-6.5" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" /></svg> }
+    </button>
+  `,
+                }]
+        }] });
+/** Cabecalho ordenavel: `<th [smzTtSortableColumn]="'nome'">Nome <ui-tree-table-sort-icon field="nome" /></th>`. */
+class SmzTreeTableSortableColumnDirective {
+    table = inject(SmzTreeTableComponent);
+    field = input.required({ ...(ngDevMode ? { debugName: "field" } : {}), alias: 'smzTtSortableColumn' });
+    ariaSort() {
+        return this.table.sortField() === this.field() ? (this.table.sortOrder() === 1 ? 'ascending' : 'descending') : 'none';
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SmzTreeTableSortableColumnDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.1", type: SmzTreeTableSortableColumnDirective, isStandalone: true, selector: "th[smzTtSortableColumn]", inputs: { field: { classPropertyName: "field", publicName: "smzTtSortableColumn", isSignal: true, isRequired: true, transformFunction: null } }, host: { listeners: { "click": "table.sortBy(field())" }, properties: { "attr.aria-sort": "ariaSort()" }, classAttribute: "cursor-pointer select-none" }, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SmzTreeTableSortableColumnDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'th[smzTtSortableColumn]',
+                    host: { class: 'cursor-pointer select-none', '(click)': 'table.sortBy(field())', '[attr.aria-sort]': 'ariaSort()' },
+                }]
+        }], propDecorators: { field: [{ type: i0.Input, args: [{ isSignal: true, alias: "smzTtSortableColumn", required: true }] }] } });
+class SmzTreeTableSortIconComponent {
+    table = inject(SmzTreeTableComponent);
+    field = input.required(...(ngDevMode ? [{ debugName: "field" }] : []));
+    dir() {
+        return this.table.sortField() === this.field() ? this.table.sortOrder() : 0;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SmzTreeTableSortIconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.1", type: SmzTreeTableSortIconComponent, isStandalone: true, selector: "ui-tree-table-sort-icon", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, host: { classAttribute: "ml-1 inline-flex align-middle text-ui-fg-muted" }, ngImport: i0, template: `
+    <svg viewBox="0 0 16 16" class="h-3.5 w-3.5" fill="none" aria-hidden="true">
+      <path d="M5 6l3-3 3 3" [attr.stroke]="dir() === 1 ? 'rgb(var(--smz-color-primary))' : 'currentColor'" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" />
+      <path d="M5 10l3 3 3-3" [attr.stroke]="dir() === -1 ? 'rgb(var(--smz-color-primary))' : 'currentColor'" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" />
+    </svg>
+  `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SmzTreeTableSortIconComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ui-tree-table-sort-icon',
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    host: { class: 'ml-1 inline-flex align-middle text-ui-fg-muted' },
+                    template: `
+    <svg viewBox="0 0 16 16" class="h-3.5 w-3.5" fill="none" aria-hidden="true">
+      <path d="M5 6l3-3 3 3" [attr.stroke]="dir() === 1 ? 'rgb(var(--smz-color-primary))' : 'currentColor'" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" />
+      <path d="M5 10l3 3 3-3" [attr.stroke]="dir() === -1 ? 'rgb(var(--smz-color-primary))' : 'currentColor'" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" />
+    </svg>
+  `,
+                }]
+        }], propDecorators: { field: [{ type: i0.Input, args: [{ isSignal: true, alias: "field", required: true }] }] } });
+const SMZ_TREE_TABLE = [
+    SmzTreeTableComponent,
+    SmzTreeTableRowDirective,
+    SmzTreeTableTogglerComponent,
+    SmzTreeTableCheckboxComponent,
+    SmzTreeTableHeaderCheckboxComponent,
+    SmzTreeTableSortableColumnDirective,
+    SmzTreeTableSortIconComponent,
+    SmzTemplateDirective,
+];
+
+/* eslint-disable max-len -- classes Tailwind nos templates */
+class SmzConfirmContentComponent {
+    options = inject(SmzDialogConfig).data;
+    ref = inject((SmzDialogRef));
+    close(accepted) {
+        this.ref.close(accepted);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SmzConfirmContentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.1", type: SmzConfirmContentComponent, isStandalone: true, selector: "ui-confirm-content", ngImport: i0, template: `
+    <div class="flex items-start gap-3 font-ui text-ui-md text-ui-fg">
+      @if (options.icon) {
+        <i [class]="options.icon + ' mt-0.5 text-ui-xl text-ui-warning'" aria-hidden="true"></i>
+      }
+      <p class="m-0 flex-1">{{ options.message }}</p>
+    </div>
+    <div class="mt-5 flex justify-end gap-2">
+      @if (options.rejectVisible !== false) {
+        <button smzButton type="button" severity="secondary" variant="outlined" [label]="options.rejectLabel ?? 'Não'" (click)="close(false)"></button>
+      }
+      @if (options.acceptVisible !== false) {
+        <button smzButton type="button" [severity]="options.acceptSeverity ?? 'primary'" [label]="options.acceptLabel ?? 'Sim'" (click)="close(true)"></button>
+      }
+    </div>
+  `, isInline: true, dependencies: [{ kind: "component", type: SmzButtonComponent, selector: "button[smzButton], a[smzButton]", inputs: ["label", "icon", "iconPosition", "severity", "variant", "size", "text", "outlined", "rounded", "loading", "styleClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SmzConfirmContentComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ui-confirm-content',
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    imports: [SmzButtonComponent],
+                    template: `
+    <div class="flex items-start gap-3 font-ui text-ui-md text-ui-fg">
+      @if (options.icon) {
+        <i [class]="options.icon + ' mt-0.5 text-ui-xl text-ui-warning'" aria-hidden="true"></i>
+      }
+      <p class="m-0 flex-1">{{ options.message }}</p>
+    </div>
+    <div class="mt-5 flex justify-end gap-2">
+      @if (options.rejectVisible !== false) {
+        <button smzButton type="button" severity="secondary" variant="outlined" [label]="options.rejectLabel ?? 'Não'" (click)="close(false)"></button>
+      }
+      @if (options.acceptVisible !== false) {
+        <button smzButton type="button" [severity]="options.acceptSeverity ?? 'primary'" [label]="options.acceptLabel ?? 'Sim'" (click)="close(true)"></button>
+      }
+    </div>
+  `,
+                }]
+        }] });
+/**
+ * Confirmacao modal. Substitui o `ConfirmationService` + `<p-confirmdialog>` do PrimeNG
+ * (nao ha componente a declarar no template).
+ *
+ * confirm.confirm({ message: 'Excluir?', header: 'Confirmacao', icon: 'fa-solid fa-triangle-exclamation', accept: () => ..., reject: () => ... });
+ */
+class SmzConfirmationService {
+    dialogs = inject(SmzDialogService);
+    confirm(confirmation) {
+        const ref = this.dialogs.open(SmzConfirmContentComponent, {
+            header: confirmation.header ?? 'Confirmação',
+            width: confirmation.width ?? '28rem',
+            closeOnEscape: confirmation.closeOnEscape ?? true,
+            data: confirmation,
+        });
+        ref.onClose.subscribe((accepted) => {
+            if (accepted === true)
+                confirmation.accept?.();
+            else
+                confirmation.reject?.();
+        });
+        return ref;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SmzConfirmationService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SmzConfirmationService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SmzConfirmationService, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: 'root' }]
+        }] });
+
+/* eslint-disable max-len -- classes Tailwind nos templates */
+/**
+ * Selecao de arquivos com area de arrastar e soltar e lista de escolhidos.
+ * Substitui o `p-fileupload` (modo `basic`/`advanced` sem envio automatico): o envio ao servidor
+ * fica a cargo do app (ex.: `HttpClient` no handler de `(selected)`).
+ *
+ * <ui-file-upload accept="image/*" [multiple]="true" [maxFileSize]="1000000" (selected)="enviar($event.files)" />
+ */
+class SmzFileUploadComponent {
+    accept = input('', ...(ngDevMode ? [{ debugName: "accept" }] : []));
+    multiple = input(false, { ...(ngDevMode ? { debugName: "multiple" } : {}), transform: booleanAttribute });
+    disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : {}), transform: booleanAttribute });
+    /** Tamanho maximo por arquivo, em bytes. */
+    maxFileSize = input(null, ...(ngDevMode ? [{ debugName: "maxFileSize" }] : []));
+    chooseLabel = input('Escolher arquivo', ...(ngDevMode ? [{ debugName: "chooseLabel" }] : []));
+    dropLabel = input('ou arraste aqui', ...(ngDevMode ? [{ debugName: "dropLabel" }] : []));
+    selected = output();
+    removed = output();
+    rejected = output();
+    files = signal([], ...(ngDevMode ? [{ debugName: "files" }] : []));
+    dragging = signal(false, ...(ngDevMode ? [{ debugName: "dragging" }] : []));
+    fileInput = viewChild.required('picker');
+    /** Limpa a lista (equivale a `clear()` do `p-fileupload`). */
+    clear() {
+        this.files.set([]);
+        this.fileInput().nativeElement.value = '';
+    }
+    onPick(event) {
+        const target = event.target;
+        this.add(Array.from(target.files ?? []), event);
+        target.value = '';
+    }
+    onDragOver(event) {
+        if (this.disabled())
+            return;
+        event.preventDefault();
+        this.dragging.set(true);
+    }
+    onDrop(event) {
+        event.preventDefault();
+        this.dragging.set(false);
+        if (this.disabled())
+            return;
+        this.add(Array.from(event.dataTransfer?.files ?? []), event);
+    }
+    remove(file) {
+        this.files.update((list) => list.filter((entry) => entry !== file));
+        this.removed.emit({ file });
+    }
+    size(file) {
+        return file.size < 1024 * 1024 ? `${Math.max(1, Math.round(file.size / 1024))} KB` : `${(file.size / 1024 / 1024).toFixed(1)} MB`;
+    }
+    add(incoming, event) {
+        const accepted = [];
+        for (const file of incoming) {
+            if (!this.matchesAccept(file))
+                this.rejected.emit({ file, reason: 'type' });
+            else if (this.maxFileSize() != null && file.size > this.maxFileSize())
+                this.rejected.emit({ file, reason: 'size' });
+            else
+                accepted.push(file);
+        }
+        if (accepted.length === 0)
+            return;
+        const next = this.multiple() ? [...this.files(), ...accepted] : [accepted[0]];
+        this.files.set(next);
+        this.selected.emit({ files: next, originalEvent: event });
+    }
+    matchesAccept(file) {
+        const accept = (this.accept() ?? '').trim();
+        if (!accept)
+            return true;
+        return accept.split(',').map((rule) => rule.trim().toLowerCase()).some((rule) => {
+            if (rule.startsWith('.'))
+                return file.name.toLowerCase().endsWith(rule);
+            if (rule.endsWith('/*'))
+                return file.type.toLowerCase().startsWith(rule.slice(0, -1));
+            return file.type.toLowerCase() === rule;
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SmzFileUploadComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.1", type: SmzFileUploadComponent, isStandalone: true, selector: "ui-file-upload", inputs: { accept: { classPropertyName: "accept", publicName: "accept", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, maxFileSize: { classPropertyName: "maxFileSize", publicName: "maxFileSize", isSignal: true, isRequired: false, transformFunction: null }, chooseLabel: { classPropertyName: "chooseLabel", publicName: "chooseLabel", isSignal: true, isRequired: false, transformFunction: null }, dropLabel: { classPropertyName: "dropLabel", publicName: "dropLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selected: "selected", removed: "removed", rejected: "rejected" }, host: { classAttribute: "block font-ui text-ui-md text-ui-fg" }, viewQueries: [{ propertyName: "fileInput", first: true, predicate: ["picker"], descendants: true, isSignal: true }], ngImport: i0, template: `
+    <input #picker type="file" class="sr-only" [accept]="accept() ?? ''" [multiple]="multiple()" [disabled]="disabled()" (change)="onPick($event)" />
+    <div
+      class="flex flex-col items-center justify-center gap-2 rounded-card border-2 border-dashed p-6 text-center transition-colors duration-ui"
+      [class]="dragging() ? 'border-ui-primary bg-ui-primary/10' : 'border-ui-line-strong bg-ui-surface-1'"
+      [class.opacity-50]="disabled()"
+      (dragover)="onDragOver($event)"
+      (dragleave)="dragging.set(false)"
+      (drop)="onDrop($event)"
+    >
+      <button type="button" class="rounded-control border border-ui-line-strong px-control-x py-2 font-medium transition-colors duration-ui hover:bg-ui-surface-3 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ui-focus disabled:pointer-events-none" [disabled]="disabled()" (click)="picker.click()">{{ chooseLabel() }}</button>
+      <span class="text-ui-sm text-ui-fg-muted">{{ dropLabel() }}</span>
+    </div>
+    @if (files().length > 0) {
+      <ul class="m-0 mt-3 flex list-none flex-col gap-2 p-0">
+        @for (file of files(); track file) {
+          <li class="flex items-center justify-between gap-2 rounded-control border border-ui-line px-3 py-2">
+            <span class="min-w-0 flex-1 truncate">{{ file.name }} <span class="text-ui-sm text-ui-fg-muted">({{ size(file) }})</span></span>
+            <button type="button" class="inline-flex h-6 w-6 items-center justify-center rounded-full text-ui-fg-muted hover:bg-ui-surface-3" aria-label="Remover" (click)="remove(file)">
+              <svg viewBox="0 0 16 16" class="h-3 w-3" fill="none" aria-hidden="true"><path d="M4 4l8 8M12 4l-8 8" stroke="currentColor" stroke-width="1.75" stroke-linecap="round" /></svg>
+            </button>
+          </li>
+        }
+      </ul>
+    }
+  `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: SmzFileUploadComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'ui-file-upload',
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    host: { class: 'block font-ui text-ui-md text-ui-fg' },
+                    template: `
+    <input #picker type="file" class="sr-only" [accept]="accept() ?? ''" [multiple]="multiple()" [disabled]="disabled()" (change)="onPick($event)" />
+    <div
+      class="flex flex-col items-center justify-center gap-2 rounded-card border-2 border-dashed p-6 text-center transition-colors duration-ui"
+      [class]="dragging() ? 'border-ui-primary bg-ui-primary/10' : 'border-ui-line-strong bg-ui-surface-1'"
+      [class.opacity-50]="disabled()"
+      (dragover)="onDragOver($event)"
+      (dragleave)="dragging.set(false)"
+      (drop)="onDrop($event)"
+    >
+      <button type="button" class="rounded-control border border-ui-line-strong px-control-x py-2 font-medium transition-colors duration-ui hover:bg-ui-surface-3 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ui-focus disabled:pointer-events-none" [disabled]="disabled()" (click)="picker.click()">{{ chooseLabel() }}</button>
+      <span class="text-ui-sm text-ui-fg-muted">{{ dropLabel() }}</span>
+    </div>
+    @if (files().length > 0) {
+      <ul class="m-0 mt-3 flex list-none flex-col gap-2 p-0">
+        @for (file of files(); track file) {
+          <li class="flex items-center justify-between gap-2 rounded-control border border-ui-line px-3 py-2">
+            <span class="min-w-0 flex-1 truncate">{{ file.name }} <span class="text-ui-sm text-ui-fg-muted">({{ size(file) }})</span></span>
+            <button type="button" class="inline-flex h-6 w-6 items-center justify-center rounded-full text-ui-fg-muted hover:bg-ui-surface-3" aria-label="Remover" (click)="remove(file)">
+              <svg viewBox="0 0 16 16" class="h-3 w-3" fill="none" aria-hidden="true"><path d="M4 4l8 8M12 4l-8 8" stroke="currentColor" stroke-width="1.75" stroke-linecap="round" /></svg>
+            </button>
+          </li>
+        }
+      </ul>
+    }
+  `,
+                }]
+        }], propDecorators: { accept: [{ type: i0.Input, args: [{ isSignal: true, alias: "accept", required: false }] }], multiple: [{ type: i0.Input, args: [{ isSignal: true, alias: "multiple", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], maxFileSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxFileSize", required: false }] }], chooseLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "chooseLabel", required: false }] }], dropLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "dropLabel", required: false }] }], selected: [{ type: i0.Output, args: ["selected"] }], removed: [{ type: i0.Output, args: ["removed"] }], rejected: [{ type: i0.Output, args: ["rejected"] }], fileInput: [{ type: i0.ViewChild, args: ['picker', { isSignal: true }] }] } });
+
 /**
  * Generated bundle index. Do not edit.
  */
 
-export { SMZ_DIALOG_CONTENT, SMZ_SOFT_TONE, SMZ_SOLID_TONE, SmzAccordionComponent, SmzAccordionContentComponent, SmzAccordionHeaderComponent, SmzAccordionPanelComponent, SmzAnchoredPanel, SmzAutoCompleteComponent, SmzAutoFocusDirective, SmzBadgeComponent, SmzBadgeDirective, SmzBlockUiComponent, SmzButtonComponent, SmzCheckboxComponent, SmzColorPickerComponent, SmzConnectedOverlayScrollHandler, SmzDataViewComponent, SmzDatePickerComponent, SmzDialogComponent, SmzDialogConfig, SmzDialogFrameComponent, SmzDialogRef, SmzDialogService, SmzDividerComponent, SmzDomHandler, SmzDrawerComponent, SmzFilterMatchMode, SmzFilterOperator, SmzFilterService, SmzIconComponent, SmzIconFieldComponent, SmzInputGroupAddonComponent, SmzInputGroupComponent, SmzInputIconComponent, SmzInputMaskComponent, SmzInputNumberComponent, SmzInputTextDirective, SmzListboxComponent, SmzLocaleService, SmzMenuListComponent, SmzMessageComponent, SmzMessageService, SmzMultiSelectComponent, SmzObjectUtils, SmzPaginatorComponent, SmzPasswordComponent, SmzPickListComponent, SmzPopoverComponent, SmzProgressBarComponent, SmzRadioButtonComponent, SmzRippleDirective, SmzSelectButtonComponent, SmzSelectComponent, SmzSkeletonComponent, SmzStyleClassDirective, SmzTabComponent, SmzTabListComponent, SmzTabPanelComponent, SmzTabPanelsComponent, SmzTabsComponent, SmzTagComponent, SmzTemplateDirective, SmzTextareaDirective, SmzThemeService, SmzToastContainerComponent, SmzToggleSwitchComponent, SmzToolbarComponent, SmzTooltipComponent, SmzTooltipDirective, SmzTranslationKeys, SmzTreeSelectComponent, SmzUiTimelineComponent, SmzUiTreeComponent, SmzValueAccessor, SmzZIndex, filterOptions, optionDisabled, optionLabel, optionValue, sameValue, smzCalendarStart, smzCx, smzFindTemplate, smzFormatDate, smzMergeClasses, smzNormalizeSeverity, smzNormalizeStyleClass, smzParseButtonStyleClass, smzParseDate, smzSameDay, smzStartOfDay, smzStaticHostClass, smzTwoDigits, smzUniqueId, smzVariants };
+export { SMZ_DIALOG_CONTENT, SMZ_SOFT_TONE, SMZ_SOLID_TONE, SMZ_TREE_TABLE, SmzAccordionComponent, SmzAccordionContentComponent, SmzAccordionHeaderComponent, SmzAccordionPanelComponent, SmzAnchoredPanel, SmzAutoCompleteComponent, SmzAutoFocusDirective, SmzBadgeComponent, SmzBadgeDirective, SmzBlockUiComponent, SmzButtonComponent, SmzCardComponent, SmzCheckboxComponent, SmzColorPickerComponent, SmzConfirmContentComponent, SmzConfirmationService, SmzConnectedOverlayScrollHandler, SmzDataViewComponent, SmzDatePickerComponent, SmzDialogComponent, SmzDialogConfig, SmzDialogFrameComponent, SmzDialogRef, SmzDialogService, SmzDividerComponent, SmzDomHandler, SmzDrawerComponent, SmzFileUploadComponent, SmzFilterMatchMode, SmzFilterOperator, SmzFilterService, SmzFloatLabelComponent, SmzIconComponent, SmzIconFieldComponent, SmzInputGroupAddonComponent, SmzInputGroupComponent, SmzInputIconComponent, SmzInputMaskComponent, SmzInputNumberComponent, SmzInputTextDirective, SmzListboxComponent, SmzLocaleService, SmzMenuListComponent, SmzMessageComponent, SmzMessageService, SmzMultiSelectComponent, SmzObjectUtils, SmzPaginatorComponent, SmzPanelComponent, SmzPasswordComponent, SmzPickListComponent, SmzPopoverComponent, SmzProgressBarComponent, SmzProgressSpinnerComponent, SmzRadioButtonComponent, SmzRippleDirective, SmzSelectButtonComponent, SmzSelectComponent, SmzSkeletonComponent, SmzSplitterComponent, SmzSplitterPanelComponent, SmzStyleClassDirective, SmzTabComponent, SmzTabListComponent, SmzTabPanelComponent, SmzTabPanelsComponent, SmzTabsComponent, SmzTagComponent, SmzTemplateDirective, SmzTextareaDirective, SmzThemeService, SmzToastContainerComponent, SmzToggleSwitchComponent, SmzToolbarComponent, SmzTooltipComponent, SmzTooltipDirective, SmzTranslationKeys, SmzTreeSelectComponent, SmzTreeTableCheckboxComponent, SmzTreeTableComponent, SmzTreeTableHeaderCheckboxComponent, SmzTreeTableRowDirective, SmzTreeTableSortIconComponent, SmzTreeTableSortableColumnDirective, SmzTreeTableTogglerComponent, SmzUiTimelineComponent, SmzUiTreeComponent, SmzValueAccessor, SmzZIndex, filterOptions, optionDisabled, optionLabel, optionValue, sameValue, smzCalendarStart, smzCx, smzFindTemplate, smzFormatDate, smzMergeClasses, smzNormalizeSeverity, smzNormalizeStyleClass, smzParseButtonStyleClass, smzParseDate, smzSameDay, smzStartOfDay, smzStaticHostClass, smzTwoDigits, smzUniqueId, smzVariants };
 //# sourceMappingURL=ngx-smz-ui-kit.mjs.map