orbiq-neural-ui-kit 1.1.34 → 1.2.36

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/fesm2022/orbiq-neural-ui-kit.mjs +42 -64
  2. package/fesm2022/orbiq-neural-ui-kit.mjs.map +1 -1
  3. package/package.json +1 -1
package/fesm2022/orbiq-neural-ui-kit.mjs CHANGED
@@ -477,7 +477,7 @@ class NeuralButtonComponent {
477
477
  iconClasses = computed(() => {
478
478
  const fontSizes = {
479
479
  'xs': 'text-[14px]',
480
- 'sm': 'text-[18px]', // Aumentado a 18px para que se vean mejor en botones pequeños
480
+ 'sm': this.iconOnly() ? 'text-[16px]' : 'text-[18px]',
481
481
  'md': 'text-[20px]',
482
482
  'lg': 'text-[24px]',
483
483
  'xl': 'text-[28px]',
@@ -551,7 +551,7 @@ class NeuralButtonComponent {
551
551
  const sizeClasses = this.iconOnly()
552
552
  ? {
553
553
  xs: 'h-6 w-6 rounded-3',
554
- sm: 'h-8 w-8 rounded-4',
554
+ sm: 'h-7 w-7 rounded-4',
555
555
  md: 'h-10 w-10 rounded-4',
556
556
  lg: 'h-12 w-12 rounded-5',
557
557
  xl: 'h-14 w-14 rounded-5',
@@ -12803,43 +12803,36 @@ class NeuralDataTableComponent {
12803
12803
 
12804
12804
  <!-- Built-in Actions Group (Clean, no background) -->
12805
12805
  <div class="flex items-center gap-0.5">
12806
- <button class="flex items-center justify-center size-7 rounded-md hover:bg-surface-gray-1 text-ink-gray-6 hover:text-ink-gray-9 transition-colors" title="Vista" (click)="onViewChange.emit('report')">
12807
- <i class="lucide-list size-4" style="stroke-width: 2px;"></i>
12808
- </button>
12809
- <button class="flex items-center justify-center size-7 rounded-md hover:bg-surface-gray-1 text-ink-gray-6 hover:text-ink-gray-9 transition-colors" title="Filtrar" (click)="onFilterClick.emit()">
12810
- <i class="lucide-filter size-4" style="stroke-width: 2px;"></i>
12811
- </button>
12812
- <button class="flex items-center justify-center size-7 rounded-md hover:bg-surface-gray-1 text-ink-gray-6 hover:text-ink-gray-9 transition-colors" title="Orden" (click)="onSortChangeClick.emit()">
12813
- <i class="lucide-arrow-up-down size-4" style="stroke-width: 2px;"></i>
12814
- </button>
12806
+ <neural-button variant="ghost" size="sm" icon="lucide-list" [iconOnly]="true" title="Vista" (clicked)="onViewChange.emit('report')"></neural-button>
12807
+ <neural-button variant="ghost" size="sm" icon="lucide-filter" [iconOnly]="true" title="Filtrar" (clicked)="onFilterClick.emit()"></neural-button>
12808
+ <neural-button variant="ghost" size="sm" icon="lucide-arrow-up-down" [iconOnly]="true" title="Orden" (clicked)="onSortChangeClick.emit()"></neural-button>
12815
12809
  </div>
12816
12810
 
12817
12811
  <div class="w-px h-4 bg-outline-gray-2 mx-1.5"></div>
12818
12812
 
12819
12813
  <div class="flex items-center gap-0.5">
12820
12814
  <!-- Search Icon -->
12821
- <button class="flex items-center justify-center size-7 rounded-md hover:bg-surface-gray-1 text-ink-gray-6 hover:text-ink-gray-9 transition-colors" title="Buscar" (click)="onSearchClick.emit()">
12822
- <i class="lucide-search size-4" style="stroke-width: 2px;"></i>
12823
- </button>
12824
- <button class="flex items-center justify-center size-7 rounded-md hover:bg-surface-gray-1 text-ink-gray-6 hover:text-ink-gray-9 transition-colors" title="Actualizar" (click)="onRefreshClick.emit()">
12825
- <i class="lucide-refresh-cw size-4" style="stroke-width: 2px;"></i>
12826
- </button>
12815
+ <neural-button variant="ghost" size="sm" icon="lucide-search" [iconOnly]="true" title="Buscar" (clicked)="onSearchClick.emit()"></neural-button>
12816
+ <neural-button variant="ghost" size="sm" icon="lucide-refresh-cw" [iconOnly]="true" title="Actualizar" (clicked)="onRefreshClick.emit()"></neural-button>
12827
12817
 
12828
12818
  <!-- Dynamic Custom Actions -->
12829
12819
  @for (action of visibleCustomActions(); track action.id) {
12830
- <button class="flex items-center justify-center size-7 rounded-md hover:bg-surface-gray-1 text-ink-gray-6 hover:text-ink-gray-9 transition-colors disabled:opacity-50"
12831
- [title]="action.label"
12832
- [disabled]="action.disabled"
12833
- (click)="onCustomActionClick.emit(action.id)">
12834
- <i [class]="action.icon + ' size-4'" style="stroke-width: 2px;"></i>
12835
- </button>
12820
+ <neural-button
12821
+ variant="ghost"
12822
+ size="sm"
12823
+ [icon]="action.icon"
12824
+ [iconOnly]="true"
12825
+ [title]="action.label"
12826
+ [disabled]="action.disabled ?? false"
12827
+ (clicked)="onCustomActionClick.emit(action.id)">
12828
+ </neural-button>
12836
12829
  }
12837
12830
 
12838
12831
  @if (overflowCustomActions().length > 0) {
12839
12832
  <neural-dropdown [options]="overflowDropdownOptions()" (onSelect)="onCustomActionDropdownSelect($event)" [hasTriggerSlot]="true" placement="bottom-end">
12840
- <button trigger class="flex items-center justify-center size-7 rounded-md hover:bg-surface-gray-1 text-ink-gray-6 hover:text-ink-gray-9 transition-colors" title="Más acciones">
12841
- <i class="lucide-more-horizontal size-4" style="stroke-width: 2px;"></i>
12842
- </button>
12833
+ <div trigger>
12834
+ <neural-button variant="ghost" size="sm" icon="lucide-more-horizontal" [iconOnly]="true" title="Más acciones"></neural-button>
12835
+ </div>
12843
12836
  </neural-dropdown>
12844
12837
  }
12845
12838
  </div>
@@ -12869,19 +12862,15 @@ class NeuralDataTableComponent {
12869
12862
 
12870
12863
  <!-- Settings, Help and External Actions -->
12871
12864
  <div class="flex items-center gap-0.5">
12872
- <button class="flex items-center justify-center size-7 rounded-md hover:bg-surface-gray-1 text-ink-gray-6 hover:text-ink-gray-9 transition-colors" title="Configurar columnas" (click)="isPreferencesOpen.set(true)">
12873
- <i class="lucide-columns size-4" style="stroke-width: 2px;"></i>
12874
- </button>
12875
- <button class="flex items-center justify-center size-7 rounded-md hover:bg-surface-gray-1 text-ink-gray-6 hover:text-ink-gray-9 transition-colors" title="Ayuda / Información" (click)="onHelpClick.emit()">
12876
- <i class="lucide-help-circle size-4" style="stroke-width: 2px;"></i>
12877
- </button>
12865
+ <neural-button variant="ghost" size="sm" icon="lucide-columns" [iconOnly]="true" title="Configurar columnas" (clicked)="isPreferencesOpen.set(true)"></neural-button>
12866
+ <neural-button variant="ghost" size="sm" icon="lucide-help-circle" [iconOnly]="true" title="Ayuda / Información" (clicked)="onHelpClick.emit()"></neural-button>
12878
12867
 
12879
12868
  <ng-content select="[header-actions]"></ng-content>
12880
12869
  </div>
12881
12870
 
12882
12871
  <div class="ms-1.5">
12883
12872
  <!-- + Nuevo Button -->
12884
- <neural-button variant="solid" theme="gray" size="sm" icon="lucide-plus" [iconLeft]="true" class="!px-3 !h-7 !text-[11px]" (click)="onNewClick.emit()">
12873
+ <neural-button variant="solid" theme="gray" size="sm" icon="lucide-plus" [iconLeft]="true" class="!px-3 !h-7 !text-[11px]" (clicked)="onNewClick.emit()">
12885
12874
  {{ newLabel() }}
12886
12875
  </neural-button>
12887
12876
  </div>
@@ -13051,43 +13040,36 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImpor
13051
13040
 
13052
13041
  <!-- Built-in Actions Group (Clean, no background) -->
13053
13042
  <div class="flex items-center gap-0.5">
13054
- <button class="flex items-center justify-center size-7 rounded-md hover:bg-surface-gray-1 text-ink-gray-6 hover:text-ink-gray-9 transition-colors" title="Vista" (click)="onViewChange.emit('report')">
13055
- <i class="lucide-list size-4" style="stroke-width: 2px;"></i>
13056
- </button>
13057
- <button class="flex items-center justify-center size-7 rounded-md hover:bg-surface-gray-1 text-ink-gray-6 hover:text-ink-gray-9 transition-colors" title="Filtrar" (click)="onFilterClick.emit()">
13058
- <i class="lucide-filter size-4" style="stroke-width: 2px;"></i>
13059
- </button>
13060
- <button class="flex items-center justify-center size-7 rounded-md hover:bg-surface-gray-1 text-ink-gray-6 hover:text-ink-gray-9 transition-colors" title="Orden" (click)="onSortChangeClick.emit()">
13061
- <i class="lucide-arrow-up-down size-4" style="stroke-width: 2px;"></i>
13062
- </button>
13043
+ <neural-button variant="ghost" size="sm" icon="lucide-list" [iconOnly]="true" title="Vista" (clicked)="onViewChange.emit('report')"></neural-button>
13044
+ <neural-button variant="ghost" size="sm" icon="lucide-filter" [iconOnly]="true" title="Filtrar" (clicked)="onFilterClick.emit()"></neural-button>
13045
+ <neural-button variant="ghost" size="sm" icon="lucide-arrow-up-down" [iconOnly]="true" title="Orden" (clicked)="onSortChangeClick.emit()"></neural-button>
13063
13046
  </div>
13064
13047
 
13065
13048
  <div class="w-px h-4 bg-outline-gray-2 mx-1.5"></div>
13066
13049
 
13067
13050
  <div class="flex items-center gap-0.5">
13068
13051
  <!-- Search Icon -->
13069
- <button class="flex items-center justify-center size-7 rounded-md hover:bg-surface-gray-1 text-ink-gray-6 hover:text-ink-gray-9 transition-colors" title="Buscar" (click)="onSearchClick.emit()">
13070
- <i class="lucide-search size-4" style="stroke-width: 2px;"></i>
13071
- </button>
13072
- <button class="flex items-center justify-center size-7 rounded-md hover:bg-surface-gray-1 text-ink-gray-6 hover:text-ink-gray-9 transition-colors" title="Actualizar" (click)="onRefreshClick.emit()">
13073
- <i class="lucide-refresh-cw size-4" style="stroke-width: 2px;"></i>
13074
- </button>
13052
+ <neural-button variant="ghost" size="sm" icon="lucide-search" [iconOnly]="true" title="Buscar" (clicked)="onSearchClick.emit()"></neural-button>
13053
+ <neural-button variant="ghost" size="sm" icon="lucide-refresh-cw" [iconOnly]="true" title="Actualizar" (clicked)="onRefreshClick.emit()"></neural-button>
13075
13054
 
13076
13055
  <!-- Dynamic Custom Actions -->
13077
13056
  @for (action of visibleCustomActions(); track action.id) {
13078
- <button class="flex items-center justify-center size-7 rounded-md hover:bg-surface-gray-1 text-ink-gray-6 hover:text-ink-gray-9 transition-colors disabled:opacity-50"
13079
- [title]="action.label"
13080
- [disabled]="action.disabled"
13081
- (click)="onCustomActionClick.emit(action.id)">
13082
- <i [class]="action.icon + ' size-4'" style="stroke-width: 2px;"></i>
13083
- </button>
13057
+ <neural-button
13058
+ variant="ghost"
13059
+ size="sm"
13060
+ [icon]="action.icon"
13061
+ [iconOnly]="true"
13062
+ [title]="action.label"
13063
+ [disabled]="action.disabled ?? false"
13064
+ (clicked)="onCustomActionClick.emit(action.id)">
13065
+ </neural-button>
13084
13066
  }
13085
13067
 
13086
13068
  @if (overflowCustomActions().length > 0) {
13087
13069
  <neural-dropdown [options]="overflowDropdownOptions()" (onSelect)="onCustomActionDropdownSelect($event)" [hasTriggerSlot]="true" placement="bottom-end">
13088
- <button trigger class="flex items-center justify-center size-7 rounded-md hover:bg-surface-gray-1 text-ink-gray-6 hover:text-ink-gray-9 transition-colors" title="Más acciones">
13089
- <i class="lucide-more-horizontal size-4" style="stroke-width: 2px;"></i>
13090
- </button>
13070
+ <div trigger>
13071
+ <neural-button variant="ghost" size="sm" icon="lucide-more-horizontal" [iconOnly]="true" title="Más acciones"></neural-button>
13072
+ </div>
13091
13073
  </neural-dropdown>
13092
13074
  }
13093
13075
  </div>
@@ -13117,19 +13099,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImpor
13117
13099
 
13118
13100
  <!-- Settings, Help and External Actions -->
13119
13101
  <div class="flex items-center gap-0.5">
13120
- <button class="flex items-center justify-center size-7 rounded-md hover:bg-surface-gray-1 text-ink-gray-6 hover:text-ink-gray-9 transition-colors" title="Configurar columnas" (click)="isPreferencesOpen.set(true)">
13121
- <i class="lucide-columns size-4" style="stroke-width: 2px;"></i>
13122
- </button>
13123
- <button class="flex items-center justify-center size-7 rounded-md hover:bg-surface-gray-1 text-ink-gray-6 hover:text-ink-gray-9 transition-colors" title="Ayuda / Información" (click)="onHelpClick.emit()">
13124
- <i class="lucide-help-circle size-4" style="stroke-width: 2px;"></i>
13125
- </button>
13102
+ <neural-button variant="ghost" size="sm" icon="lucide-columns" [iconOnly]="true" title="Configurar columnas" (clicked)="isPreferencesOpen.set(true)"></neural-button>
13103
+ <neural-button variant="ghost" size="sm" icon="lucide-help-circle" [iconOnly]="true" title="Ayuda / Información" (clicked)="onHelpClick.emit()"></neural-button>
13126
13104
 
13127
13105
  <ng-content select="[header-actions]"></ng-content>
13128
13106
  </div>
13129
13107
 
13130
13108
  <div class="ms-1.5">
13131
13109
  <!-- + Nuevo Button -->
13132
- <neural-button variant="solid" theme="gray" size="sm" icon="lucide-plus" [iconLeft]="true" class="!px-3 !h-7 !text-[11px]" (click)="onNewClick.emit()">
13110
+ <neural-button variant="solid" theme="gray" size="sm" icon="lucide-plus" [iconLeft]="true" class="!px-3 !h-7 !text-[11px]" (clicked)="onNewClick.emit()">
13133
13111
  {{ newLabel() }}
13134
13112
  </neural-button>
13135
13113
  </div>