orbiq-neural-ui-kit 1.1.32 → 1.1.34

package/fesm2022/orbiq-neural-ui-kit.mjs

@@ -451,6 +451,8 @@ class NeuralButtonComponent {
     ...(ngDevMode ? [{ debugName: "iconRight" }] : /* istanbul ignore next */ []));
     iconOnly = input(false, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "iconOnly" }] : /* istanbul ignore next */ []));
+    shape = input('default', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "shape" }] : /* istanbul ignore next */ []));
     // Outputs
     clicked = output();
     isDisabled = computed(() => this.disabled() || this.loading(), /* @ts-ignore */
@@ -490,7 +492,7 @@ class NeuralButtonComponent {
         const t = this.theme();
         const s = this.size();
         const solidClasses = {
-            gray: 'text-white bg-ink-gray-8 hover:bg-ink-gray-9 active:bg-surface-gray-8',
+            gray: 'text-white bg-gray-800 hover:bg-gray-900 active:bg-surface-gray-8',
             blue: 'text-ink-base bg-surface-blue-6 hover:bg-surface-blue-7 active:bg-surface-blue-8',
             green: 'text-ink-base bg-surface-green-7 hover:bg-surface-green-8 active:bg-surface-green-9',
             red: 'text-ink-base dark:text-ink-red-9 bg-surface-red-7 hover:bg-surface-red-8 active:bg-surface-red-9',
@@ -565,22 +567,26 @@ class NeuralButtonComponent {
                 '2xl': 'h-16 text-2xl px-5 rounded-6',
                 '3xl': 'h-20 text-3xl px-6 rounded-7',
             }[s];
+        let finalSizeClasses = sizeClasses;
+        if (this.shape() === 'circle') {
+            finalSizeClasses = finalSizeClasses.replace(/rounded-\d+/g, 'rounded-full');
+        }
         return [
             'inline-flex items-center justify-center gap-2 transition-colors shrink-0',
             this.isDisabled() ? 'cursor-not-allowed' : 'cursor-pointer',
             stateClasses,
             this.loading() && !this.disabled() ? 'pointer-events-none' : '',
             focusClasses[t],
-            sizeClasses,
+            finalSizeClasses,
         ].filter(Boolean).join(' ');
     }, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "computedClasses" }] : /* istanbul ignore next */ []));
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: NeuralButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.4", type: NeuralButtonComponent, isStandalone: true, selector: "neural-button", inputs: { variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, theme: { classPropertyName: "theme", publicName: "theme", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, iconLeft: { classPropertyName: "iconLeft", publicName: "iconLeft", isSignal: true, isRequired: false, transformFunction: null }, iconRight: { classPropertyName: "iconRight", publicName: "iconRight", isSignal: true, isRequired: false, transformFunction: null }, iconOnly: { classPropertyName: "iconOnly", publicName: "iconOnly", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { clicked: "clicked" }, ngImport: i0, template: `
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.4", type: NeuralButtonComponent, isStandalone: true, selector: "neural-button", inputs: { variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, theme: { classPropertyName: "theme", publicName: "theme", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, iconLeft: { classPropertyName: "iconLeft", publicName: "iconLeft", isSignal: true, isRequired: false, transformFunction: null }, iconRight: { classPropertyName: "iconRight", publicName: "iconRight", isSignal: true, isRequired: false, transformFunction: null }, iconOnly: { classPropertyName: "iconOnly", publicName: "iconOnly", isSignal: true, isRequired: false, transformFunction: null }, shape: { classPropertyName: "shape", publicName: "shape", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { clicked: "clicked" }, host: { styleAttribute: "display: inline-block" }, ngImport: i0, template: `
     <button
       [type]="type()"
       [disabled]="isDisabled()"
-      [class]="computedClasses()"
+      [class]="'w-full ' + computedClasses()"
       (click)="onClick($event)"
       [attr.aria-busy]="loading() ? 'true' : null"
     >
@@ -619,11 +625,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImpor
                     selector: 'neural-button',
                     standalone: true,
                     imports: [CommonModule, NeuralIconComponent],
+                    host: { style: 'display: inline-block' },
                     template: `
     <button
       [type]="type()"
       [disabled]="isDisabled()"
-      [class]="computedClasses()"
+      [class]="'w-full ' + computedClasses()"
       (click)="onClick($event)"
       [attr.aria-busy]="loading() ? 'true' : null"
     >
@@ -656,7 +663,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImpor
     </button>
   `
                 }]
-        }], propDecorators: { variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], theme: [{ type: i0.Input, args: [{ isSignal: true, alias: "theme", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], iconLeft: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconLeft", required: false }] }], iconRight: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconRight", required: false }] }], iconOnly: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconOnly", required: false }] }], clicked: [{ type: i0.Output, args: ["clicked"] }] } });
+        }], propDecorators: { variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], theme: [{ type: i0.Input, args: [{ isSignal: true, alias: "theme", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], iconLeft: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconLeft", required: false }] }], iconRight: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconRight", required: false }] }], iconOnly: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconOnly", required: false }] }], shape: [{ type: i0.Input, args: [{ isSignal: true, alias: "shape", required: false }] }], clicked: [{ type: i0.Output, args: ["clicked"] }] } });
 
 class NeuralLabelingWrapperComponent {
     enabled = input(true, /* @ts-ignore */
@@ -1317,7 +1324,7 @@ class NeuralDividerComponent {
     } @else {
       <hr class="border-0 border-outline-gray-2" [class]="dividerClasses()" />
     }
-  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: NeuralButtonComponent, selector: "neural-button", inputs: ["variant", "theme", "size", "type", "disabled", "loading", "icon", "iconLeft", "iconRight", "iconOnly"], outputs: ["clicked"] }] });
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: NeuralButtonComponent, selector: "neural-button", inputs: ["variant", "theme", "size", "type", "disabled", "loading", "icon", "iconLeft", "iconRight", "iconOnly", "shape"], outputs: ["clicked"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: NeuralDividerComponent, decorators: [{
             type: Component,
@@ -4180,7 +4187,7 @@ class NeuralAlertComponent {
         <svg [class]="iconColorClass()" class="size-4" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path d="M8 1C11.866 1 15 4.13401 15 8C15 11.866 11.866 15 8 15C4.13401 15 1 11.866 1 8C1 4.13401 4.13401 1 8 1ZM10.8535 5.14648C10.6583 4.95122 10.3417 4.95122 10.1465 5.14648L8 7.29297L5.85352 5.14648C5.65825 4.95122 5.34175 4.95122 5.14648 5.14648C4.95122 5.34175 4.95122 5.65825 5.14648 5.85352L7.29297 8L5.14648 10.1465C4.95122 10.3417 4.95122 10.6583 5.14648 10.8535C5.34175 11.0488 5.65825 11.0488 5.85352 10.8535L8 8.70703L10.1465 10.8535C10.3417 11.0488 10.6583 11.0488 10.8535 10.8535C11.0488 10.6583 11.0488 10.3417 10.8535 10.1465L8.70703 8L10.8535 5.85352C11.0488 5.65825 11.0488 5.34175 10.8535 5.14648Z" fill="currentColor"/></svg>
       }
     </ng-template>
-  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: NeuralButtonComponent, selector: "neural-button", inputs: ["variant", "theme", "size", "type", "disabled", "loading", "icon", "iconLeft", "iconRight", "iconOnly"], outputs: ["clicked"] }] });
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: NeuralButtonComponent, selector: "neural-button", inputs: ["variant", "theme", "size", "type", "disabled", "loading", "icon", "iconLeft", "iconRight", "iconOnly", "shape"], outputs: ["clicked"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: NeuralAlertComponent, decorators: [{
             type: Component,
@@ -4638,7 +4645,7 @@ class NeuralDropdownComponent {
         }
       }
     </ng-template>
-  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "browserUrl", "routerLink"] }, { kind: "component", type: NeuralPopoverComponent, selector: "neural-popover", inputs: ["side", "align", "offset", "bare"], outputs: ["openChange"] }, { kind: "directive", type: NeuralPopoverTriggerDirective, selector: "[neuralPopoverTrigger]" }, { kind: "directive", type: NeuralPopoverContentDirective, selector: "[neuralPopoverContent]" }, { kind: "component", type: NeuralPopoverPanelComponent, selector: "neural-popover-panel" }, { kind: "component", type: NeuralButtonComponent, selector: "neural-button", inputs: ["variant", "theme", "size", "type", "disabled", "loading", "icon", "iconLeft", "iconRight", "iconOnly"], outputs: ["clicked"] }] });
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "browserUrl", "routerLink"] }, { kind: "component", type: NeuralPopoverComponent, selector: "neural-popover", inputs: ["side", "align", "offset", "bare"], outputs: ["openChange"] }, { kind: "directive", type: NeuralPopoverTriggerDirective, selector: "[neuralPopoverTrigger]" }, { kind: "directive", type: NeuralPopoverContentDirective, selector: "[neuralPopoverContent]" }, { kind: "component", type: NeuralPopoverPanelComponent, selector: "neural-popover-panel" }, { kind: "component", type: NeuralButtonComponent, selector: "neural-button", inputs: ["variant", "theme", "size", "type", "disabled", "loading", "icon", "iconLeft", "iconRight", "iconOnly", "shape"], outputs: ["clicked"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: NeuralDropdownComponent, decorators: [{
             type: Component,
@@ -4865,7 +4872,7 @@ class NeuralBreadcrumbsComponent {
         }
       </div>
     </div>
-  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "browserUrl", "routerLink"] }, { kind: "component", type: NeuralDropdownComponent, selector: "neural-dropdown", inputs: ["options", "side", "align", "offset", "buttonLabel", "hasTriggerSlot"] }, { kind: "component", type: NeuralButtonComponent, selector: "neural-button", inputs: ["variant", "theme", "size", "type", "disabled", "loading", "icon", "iconLeft", "iconRight", "iconOnly"], outputs: ["clicked"] }] });
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "browserUrl", "routerLink"] }, { kind: "component", type: NeuralDropdownComponent, selector: "neural-dropdown", inputs: ["options", "side", "align", "offset", "buttonLabel", "hasTriggerSlot"] }, { kind: "component", type: NeuralButtonComponent, selector: "neural-button", inputs: ["variant", "theme", "size", "type", "disabled", "loading", "icon", "iconLeft", "iconRight", "iconOnly", "shape"], outputs: ["clicked"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: NeuralBreadcrumbsComponent, decorators: [{
             type: Component,
@@ -8434,8 +8441,12 @@ class NeuralDialogComponent {
         <div class="relative flex min-h-screen flex-col items-center px-4 py-4 text-center" [class]="dialogPositionClasses()" [style]="dialogPositionStyles()">
           <div class="my-8 inline-block w-full transform overflow-hidden rounded-7 bg-surface-elevation-1 text-start align-middle shadow-xl dialog-content focus-visible:outline-none" [class]="sizeClass()">
             
-            @if (bare()) {
+            <ng-template #defaultContent>
               <ng-content></ng-content>
+            </ng-template>
+
+            @if (bare()) {
+              <ng-container *ngTemplateOutlet="defaultContent"></ng-container>
             } @else {
               <!-- Diseño estándar con Header y Body -->
               <div class="bg-surface-elevation-1 px-4 pb-6 pt-5 sm:px-6">
@@ -8459,7 +8470,7 @@ class NeuralDialogComponent {
                 
                 <div [class]="icon() ? 'ml-14 mt-2' : 'mt-3'">
                   @if (hasDefaultSlot()) {
-                    <ng-content></ng-content>
+                    <ng-container *ngTemplateOutlet="defaultContent"></ng-container>
                   } @else if (message()) {
                     <p class="text-p-base text-ink-gray-7">{{ message() }}</p>
                   }
@@ -8488,7 +8499,7 @@ class NeuralDialogComponent {
         </div>
       </div>
     }
-  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: NeuralButtonComponent, selector: "neural-button", inputs: ["variant", "theme", "size", "type", "disabled", "loading", "icon", "iconLeft", "iconRight", "iconOnly"], outputs: ["clicked"] }] });
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: NeuralButtonComponent, selector: "neural-button", inputs: ["variant", "theme", "size", "type", "disabled", "loading", "icon", "iconLeft", "iconRight", "iconOnly", "shape"], outputs: ["clicked"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: NeuralDialogComponent, decorators: [{
             type: Component,
@@ -8504,8 +8515,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImpor
         <div class="relative flex min-h-screen flex-col items-center px-4 py-4 text-center" [class]="dialogPositionClasses()" [style]="dialogPositionStyles()">
           <div class="my-8 inline-block w-full transform overflow-hidden rounded-7 bg-surface-elevation-1 text-start align-middle shadow-xl dialog-content focus-visible:outline-none" [class]="sizeClass()">
             
-            @if (bare()) {
+            <ng-template #defaultContent>
               <ng-content></ng-content>
+            </ng-template>
+
+            @if (bare()) {
+              <ng-container *ngTemplateOutlet="defaultContent"></ng-container>
             } @else {
               <!-- Diseño estándar con Header y Body -->
               <div class="bg-surface-elevation-1 px-4 pb-6 pt-5 sm:px-6">
@@ -8529,7 +8544,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImpor
                 
                 <div [class]="icon() ? 'ml-14 mt-2' : 'mt-3'">
                   @if (hasDefaultSlot()) {
-                    <ng-content></ng-content>
+                    <ng-container *ngTemplateOutlet="defaultContent"></ng-container>
                   } @else if (message()) {
                     <p class="text-p-base text-ink-gray-7">{{ message() }}</p>
                   }
@@ -11873,7 +11888,7 @@ class NeuralDrawerComponent {
         </div>
       </div>
     </ng-template>
-  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: DialogModule }, { kind: "component", type: NeuralButtonComponent, selector: "neural-button", inputs: ["variant", "theme", "size", "type", "disabled", "loading", "icon", "iconLeft", "iconRight", "iconOnly"], outputs: ["clicked"] }] });
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: DialogModule }, { kind: "component", type: NeuralButtonComponent, selector: "neural-button", inputs: ["variant", "theme", "size", "type", "disabled", "loading", "icon", "iconLeft", "iconRight", "iconOnly", "shape"], outputs: ["clicked"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: NeuralDrawerComponent, decorators: [{
             type: Component,
@@ -12028,7 +12043,7 @@ class NeuralFileUploaderComponent {
         </div>
       }
     </div>
-  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: NeuralButtonComponent, selector: "neural-button", inputs: ["variant", "theme", "size", "type", "disabled", "loading", "icon", "iconLeft", "iconRight", "iconOnly"], outputs: ["clicked"] }, { kind: "component", type: NeuralErrorMessageComponent, selector: "neural-error-message", inputs: ["message"] }] });
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: NeuralButtonComponent, selector: "neural-button", inputs: ["variant", "theme", "size", "type", "disabled", "loading", "icon", "iconLeft", "iconRight", "iconOnly", "shape"], outputs: ["clicked"] }, { kind: "component", type: NeuralErrorMessageComponent, selector: "neural-error-message", inputs: ["message"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: NeuralFileUploaderComponent, decorators: [{
             type: Component,
@@ -13002,7 +13017,7 @@ class NeuralDataTableComponent {
         </div>
       </neural-dialog>
     </div>
-  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: NeuralButtonComponent, selector: "neural-button", inputs: ["variant", "theme", "size", "type", "disabled", "loading", "icon", "iconLeft", "iconRight", "iconOnly"], outputs: ["clicked"] }, { kind: "component", type: NeuralDialogComponent, selector: "neural-dialog", inputs: ["openModel", "title", "message", "icon", "size", "position", "paddingTop", "actions", "dismissible", "showCloseButton", "bare", "hasTitleSlot", "hasActionsSlot", "hasDefaultSlot"], outputs: ["openModelChange"] }, { kind: "component", type: NeuralSwitchComponent, selector: "neural-switch", inputs: ["valueModel", "size", "padded", "disabled", "required", "controlPosition", "icon", "label", "description", "error", "id", "hasLabelSlot", "hasDescriptionSlot"], outputs: ["valueModelChange"] }, { kind: "component", type: NeuralCheckboxComponent, selector: "neural-checkbox", inputs: ["checkedModel", "size", "padded", "indeterminate", "disabled", "required", "label", "description", "error", "id", "hasLabelSlot", "hasDescriptionSlot"], outputs: ["checkedModelChange"] }, { kind: "component", type: NeuralDropdownComponent, selector: "neural-dropdown", inputs: ["options", "side", "align", "offset", "buttonLabel", "hasTriggerSlot"] }] });
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: NeuralButtonComponent, selector: "neural-button", inputs: ["variant", "theme", "size", "type", "disabled", "loading", "icon", "iconLeft", "iconRight", "iconOnly", "shape"], outputs: ["clicked"] }, { kind: "component", type: NeuralDialogComponent, selector: "neural-dialog", inputs: ["openModel", "title", "message", "icon", "size", "position", "paddingTop", "actions", "dismissible", "showCloseButton", "bare", "hasTitleSlot", "hasActionsSlot", "hasDefaultSlot"], outputs: ["openModelChange"] }, { kind: "component", type: NeuralSwitchComponent, selector: "neural-switch", inputs: ["valueModel", "size", "padded", "disabled", "required", "controlPosition", "icon", "label", "description", "error", "id", "hasLabelSlot", "hasDescriptionSlot"], outputs: ["valueModelChange"] }, { kind: "component", type: NeuralCheckboxComponent, selector: "neural-checkbox", inputs: ["checkedModel", "size", "padded", "indeterminate", "disabled", "required", "label", "description", "error", "id", "hasLabelSlot", "hasDescriptionSlot"], outputs: ["checkedModelChange"] }, { kind: "component", type: NeuralDropdownComponent, selector: "neural-dropdown", inputs: ["options", "side", "align", "offset", "buttonLabel", "hasTriggerSlot"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: NeuralDataTableComponent, decorators: [{
             type: Component,
@@ -13602,7 +13617,7 @@ class NeuralFilterBuilderComponent {
         });
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: NeuralFilterBuilderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.4", type: NeuralFilterBuilderComponent, isStandalone: true, selector: "neural-filter-builder", inputs: { fields: { classPropertyName: "fields", publicName: "fields", isSignal: true, isRequired: true, transformFunction: null }, valueInputTemplate: { classPropertyName: "valueInputTemplate", publicName: "valueInputTemplate", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { apply: "apply" }, ngImport: i0, template: "<div class=\"bg-surface-base border border-outline-gray-2 rounded-[12px] shadow-[0_12px_40px_rgba(0,0,0,0.12)] w-full max-w-[540px] text-[13px] flex flex-col p-5\">\n  \n  <!-- Lista de Filtros -->\n  <div class=\"flex flex-col gap-3\">\n    @for (rule of rules(); track $index) {\n      <div class=\"flex items-center gap-3 w-full\">\n        \n        <!-- Seleccionar Campo -->\n        <select \n          class=\"w-[170px] flex-shrink-0 bg-surface-gray-1 border-none focus:ring-1 focus:ring-outline-gray-4 rounded-md h-8 px-3 outline-none transition-colors text-ink-gray-8 text-[13px]\"\n          [ngModel]=\"rule.field\" \n          (ngModelChange)=\"updateRule($index, 'field', $event)\">\n          <option value=\"\" disabled>Seleccione un campo...</option>\n          @for (field of fields(); track field.key) {\n            <option [value]=\"field.key\">{{ field.label }}</option>\n          }\n        </select>\n\n        <!-- Seleccionar Operador -->\n        <select \n          class=\"w-[120px] flex-shrink-0 bg-surface-gray-1 border-none focus:ring-1 focus:ring-outline-gray-4 rounded-md h-8 px-3 outline-none transition-colors text-ink-gray-8 text-[13px]\"\n          [ngModel]=\"rule.operator\" \n          (ngModelChange)=\"updateRule($index, 'operator', $event)\">\n          @for (op of operators; track op.value) {\n            <option [value]=\"op.value\">{{ op.label }}</option>\n          }\n        </select>\n\n        <!-- Valor: Template personalizado o input por defecto -->\n        <div class=\"flex-1 relative h-8\">\n          @if (valueInputTemplate()) {\n            <ng-container *ngTemplateOutlet=\"valueInputTemplate()!; context: { $implicit: rule, index: $index, updateRule: updateRule.bind(this) }\"></ng-container>\n          } @else {\n            <input \n              type=\"text\" \n              class=\"w-full h-full bg-surface-gray-1 border-none focus:ring-1 focus:ring-outline-gray-4 rounded-md px-3 outline-none transition-colors text-ink-gray-8 text-[13px]\"\n              placeholder=\"Valor...\"\n              [ngModel]=\"rule.value\" \n              (ngModelChange)=\"updateRule($index, 'value', $event)\">\n          }\n        </div>\n\n        <!-- Bot\u00F3n para eliminar regla -->\n        <button \n          (click)=\"removeRule($index)\"\n          class=\"h-8 w-6 flex items-center justify-center text-ink-gray-4 hover:text-ink-gray-8 transition-colors flex-shrink-0\"\n          aria-label=\"Eliminar filtro\">\n          <neural-icon name=\"lucide-x\" class=\"size-4 stroke-[3]\"></neural-icon>\n        </button>\n      </div>\n    }\n  </div>\n\n  <hr class=\"border-outline-gray-2 my-5\">\n\n  <!-- Acciones -->\n  <div class=\"flex items-center justify-between\">\n    <neural-button \n      variant=\"ghost\" \n      size=\"sm\"\n      icon=\"lucide-plus\"\n      [iconLeft]=\"true\"\n      (clicked)=\"addRule()\">\n      A\u00F1adir Filtro\n    </neural-button>\n\n    <div class=\"flex items-center gap-2\">\n      <neural-button \n        variant=\"subtle\" \n        theme=\"gray\" \n        size=\"sm\"\n        class=\"bg-surface-gray-1\"\n        (click)=\"clearRules()\">\n        Borrar Filtros\n      </neural-button>\n      \n      <neural-button \n        variant=\"solid\" \n        theme=\"gray\"\n        size=\"sm\"\n        (click)=\"applyFilters()\">\n        Aplicar filtros\n      </neural-button>\n    </div>\n  </div>\n</div>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox]):not([ngNoCva])[formControlName],textarea:not([ngNoCva])[formControlName],input:not([type=checkbox]):not([ngNoCva])[formControl],textarea:not([ngNoCva])[formControl],input:not([type=checkbox]):not([ngNoCva])[ngModel],textarea:not([ngNoCva])[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.SelectControlValueAccessor, selector: "select:not([multiple]):not([ngNoCva])[formControlName],select:not([multiple]):not([ngNoCva])[formControl],select:not([multiple]):not([ngNoCva])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: NeuralButtonComponent, selector: "neural-button", inputs: ["variant", "theme", "size", "type", "disabled", "loading", "icon", "iconLeft", "iconRight", "iconOnly"], outputs: ["clicked"] }, { kind: "component", type: NeuralIconComponent, selector: "neural-icon", inputs: ["name"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.4", type: NeuralFilterBuilderComponent, isStandalone: true, selector: "neural-filter-builder", inputs: { fields: { classPropertyName: "fields", publicName: "fields", isSignal: true, isRequired: true, transformFunction: null }, valueInputTemplate: { classPropertyName: "valueInputTemplate", publicName: "valueInputTemplate", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { apply: "apply" }, ngImport: i0, template: "<div class=\"bg-surface-base border border-outline-gray-2 rounded-[12px] shadow-[0_12px_40px_rgba(0,0,0,0.12)] w-full max-w-[540px] text-[13px] flex flex-col p-5\">\n  \n  <!-- Lista de Filtros -->\n  <div class=\"flex flex-col gap-3\">\n    @for (rule of rules(); track $index) {\n      <div class=\"flex items-center gap-3 w-full\">\n        \n        <!-- Seleccionar Campo -->\n        <select \n          class=\"w-[170px] flex-shrink-0 bg-surface-gray-1 border-none focus:ring-1 focus:ring-outline-gray-4 rounded-md h-8 px-3 outline-none transition-colors text-ink-gray-8 text-[13px]\"\n          [ngModel]=\"rule.field\" \n          (ngModelChange)=\"updateRule($index, 'field', $event)\">\n          <option value=\"\" disabled>Seleccione un campo...</option>\n          @for (field of fields(); track field.key) {\n            <option [value]=\"field.key\">{{ field.label }}</option>\n          }\n        </select>\n\n        <!-- Seleccionar Operador -->\n        <select \n          class=\"w-[120px] flex-shrink-0 bg-surface-gray-1 border-none focus:ring-1 focus:ring-outline-gray-4 rounded-md h-8 px-3 outline-none transition-colors text-ink-gray-8 text-[13px]\"\n          [ngModel]=\"rule.operator\" \n          (ngModelChange)=\"updateRule($index, 'operator', $event)\">\n          @for (op of operators; track op.value) {\n            <option [value]=\"op.value\">{{ op.label }}</option>\n          }\n        </select>\n\n        <!-- Valor: Template personalizado o input por defecto -->\n        <div class=\"flex-1 relative h-8\">\n          @if (valueInputTemplate()) {\n            <ng-container *ngTemplateOutlet=\"valueInputTemplate()!; context: { $implicit: rule, index: $index, updateRule: updateRule.bind(this) }\"></ng-container>\n          } @else {\n            <input \n              type=\"text\" \n              class=\"w-full h-full bg-surface-gray-1 border-none focus:ring-1 focus:ring-outline-gray-4 rounded-md px-3 outline-none transition-colors text-ink-gray-8 text-[13px]\"\n              placeholder=\"Valor...\"\n              [ngModel]=\"rule.value\" \n              (ngModelChange)=\"updateRule($index, 'value', $event)\">\n          }\n        </div>\n\n        <!-- Bot\u00F3n para eliminar regla -->\n        <button \n          (click)=\"removeRule($index)\"\n          class=\"h-8 w-6 flex items-center justify-center text-ink-gray-4 hover:text-ink-gray-8 transition-colors flex-shrink-0\"\n          aria-label=\"Eliminar filtro\">\n          <neural-icon name=\"lucide-x\" class=\"size-4 stroke-[3]\"></neural-icon>\n        </button>\n      </div>\n    }\n  </div>\n\n  <hr class=\"border-outline-gray-2 my-5\">\n\n  <!-- Acciones -->\n  <div class=\"flex items-center justify-between\">\n    <neural-button \n      variant=\"ghost\" \n      size=\"sm\"\n      icon=\"lucide-plus\"\n      [iconLeft]=\"true\"\n      (clicked)=\"addRule()\">\n      A\u00F1adir Filtro\n    </neural-button>\n\n    <div class=\"flex items-center gap-2\">\n      <neural-button \n        variant=\"subtle\" \n        theme=\"gray\" \n        size=\"sm\"\n        class=\"bg-surface-gray-1\"\n        (click)=\"clearRules()\">\n        Borrar Filtros\n      </neural-button>\n      \n      <neural-button \n        variant=\"solid\" \n        theme=\"gray\"\n        size=\"sm\"\n        (click)=\"applyFilters()\">\n        Aplicar filtros\n      </neural-button>\n    </div>\n  </div>\n</div>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox]):not([ngNoCva])[formControlName],textarea:not([ngNoCva])[formControlName],input:not([type=checkbox]):not([ngNoCva])[formControl],textarea:not([ngNoCva])[formControl],input:not([type=checkbox]):not([ngNoCva])[ngModel],textarea:not([ngNoCva])[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.SelectControlValueAccessor, selector: "select:not([multiple]):not([ngNoCva])[formControlName],select:not([multiple]):not([ngNoCva])[formControl],select:not([multiple]):not([ngNoCva])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: NeuralButtonComponent, selector: "neural-button", inputs: ["variant", "theme", "size", "type", "disabled", "loading", "icon", "iconLeft", "iconRight", "iconOnly", "shape"], outputs: ["clicked"] }, { kind: "component", type: NeuralIconComponent, selector: "neural-icon", inputs: ["name"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: NeuralFilterBuilderComponent, decorators: [{
             type: Component,
@@ -15446,7 +15461,7 @@ class NeuralSubGridComponent {
         <ng-content select="[footer-totals]"></ng-content>
       </div>
     </div>
-  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: NeuralButtonComponent, selector: "neural-button", inputs: ["variant", "theme", "size", "type", "disabled", "loading", "icon", "iconLeft", "iconRight", "iconOnly"], outputs: ["clicked"] }, { kind: "component", type: NeuralCheckboxComponent, selector: "neural-checkbox", inputs: ["checkedModel", "size", "padded", "indeterminate", "disabled", "required", "label", "description", "error", "id", "hasLabelSlot", "hasDescriptionSlot"], outputs: ["checkedModelChange"] }] });
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: NeuralButtonComponent, selector: "neural-button", inputs: ["variant", "theme", "size", "type", "disabled", "loading", "icon", "iconLeft", "iconRight", "iconOnly", "shape"], outputs: ["clicked"] }, { kind: "component", type: NeuralCheckboxComponent, selector: "neural-checkbox", inputs: ["checkedModel", "size", "padded", "indeterminate", "disabled", "required", "label", "description", "error", "id", "hasLabelSlot", "hasDescriptionSlot"], outputs: ["checkedModelChange"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: NeuralSubGridComponent, decorators: [{
             type: Component,