orbiq-neural-ui-kit 1.0.25 → 1.0.27

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

@@ -473,7 +473,16 @@ class NeuralButtonComponent {
     }, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "spinnerClasses" }] : /* istanbul ignore next */ []));
     iconClasses = computed(() => {
-        return this.spinnerClasses();
+        const fontSizes = {
+            'xs': 'text-[14px]',
+            'sm': 'text-[18px]', // Aumentado a 18px para que se vean mejor en botones pequeños
+            'md': 'text-[20px]',
+            'lg': 'text-[24px]',
+            'xl': 'text-[28px]',
+            '2xl': 'text-[32px]',
+            '3xl': 'text-[40px]',
+        };
+        return fontSizes[this.size()] + ' ' + this.spinnerClasses();
     }, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "iconClasses" }] : /* istanbul ignore next */ []));
     computedClasses = computed(() => {
@@ -13666,6 +13675,119 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImpor
                 args: ['editorEl']
             }] } });
 
+class NeuralKeyboardShortcutsDialogComponent {
+    openModel = model(false, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "openModel" }] : /* istanbul ignore next */ []));
+    categories = input([], /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "categories" }] : /* istanbul ignore next */ []));
+    searchText = signal('', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "searchText" }] : /* istanbul ignore next */ []));
+    filteredCategories = computed(() => {
+        const text = this.searchText().toLowerCase().trim();
+        if (!text)
+            return this.categories();
+        const filtered = [];
+        for (const category of this.categories()) {
+            const filteredShortcuts = category.shortcuts.filter(s => s.label.toLowerCase().includes(text) ||
+                s.combo.toLowerCase().includes(text) ||
+                (s.alternativeCombo && s.alternativeCombo.toLowerCase().includes(text)));
+            if (filteredShortcuts.length > 0) {
+                filtered.push({
+                    title: category.title,
+                    shortcuts: filteredShortcuts
+                });
+            }
+        }
+        return filtered;
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "filteredCategories" }] : /* istanbul ignore next */ []));
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: NeuralKeyboardShortcutsDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.4", type: NeuralKeyboardShortcutsDialogComponent, isStandalone: true, selector: "neural-keyboard-shortcuts-dialog", inputs: { openModel: { classPropertyName: "openModel", publicName: "openModel", isSignal: true, isRequired: false, transformFunction: null }, categories: { classPropertyName: "categories", publicName: "categories", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { openModel: "openModelChange" }, ngImport: i0, template: `
+    <neural-dialog [(openModel)]="openModel" size="4xl" [hasTitleSlot]="true" [hasDefaultSlot]="true">
+      <div title class="flex items-center justify-between w-full pr-4">
+        <h3 class="text-[16px] font-semibold text-ink-gray-9">Keyboard Shortcuts</h3>
+        <div class="relative w-64">
+          <input type="text" [(ngModel)]="searchText" placeholder="Search shortcuts" 
+            class="w-full h-8 px-3 rounded-md border border-outline-gray-2 bg-surface-base text-[13px] text-ink-gray-8 focus:outline-none focus:ring-1 focus:ring-outline-gray-4 focus:border-outline-gray-4 transition-colors">
+        </div>
+      </div>
+
+      <div class="grid grid-cols-1 md:grid-cols-3 gap-10 py-2">
+        @for (category of filteredCategories(); track category.title) {
+          <div class="flex flex-col">
+            <h4 class="text-[13px] font-semibold text-ink-gray-9 mb-3">{{ category.title }}</h4>
+            <div class="flex flex-col gap-3">
+              @for (shortcut of category.shortcuts; track shortcut.label) {
+                <div class="flex justify-between items-center text-[13px] text-ink-gray-6">
+                  <span>{{ shortcut.label }}</span>
+                  <div class="flex items-center gap-1">
+                    <neural-keyboard-shortcut [combo]="shortcut.combo" [bg]="true"></neural-keyboard-shortcut>
+                    
+                    @if (shortcut.alternativeCombo) {
+                      <span class="text-ink-gray-4 text-xs font-mono">/</span>
+                      <neural-keyboard-shortcut 
+                        [combo]="shortcut.alternativeCombo" 
+                        [bg]="true" 
+                        [useIcons]="shortcut.useIcons ?? true">
+                      </neural-keyboard-shortcut>
+                    }
+                  </div>
+                </div>
+              }
+            </div>
+          </div>
+        }
+      </div>
+    </neural-dialog>
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { 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.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: NeuralDialogComponent, selector: "neural-dialog", inputs: ["openModel", "title", "message", "icon", "size", "position", "paddingTop", "actions", "dismissible", "showCloseButton", "bare", "hasTitleSlot", "hasActionsSlot", "hasDefaultSlot"], outputs: ["openModelChange"] }, { kind: "component", type: NeuralKeyboardShortcutComponent, selector: "neural-keyboard-shortcut", inputs: ["combo", "bg", "showPlus", "useIcons"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImport: i0, type: NeuralKeyboardShortcutsDialogComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'neural-keyboard-shortcuts-dialog',
+                    standalone: true,
+                    imports: [CommonModule, FormsModule, NeuralDialogComponent, NeuralKeyboardShortcutComponent],
+                    template: `
+    <neural-dialog [(openModel)]="openModel" size="4xl" [hasTitleSlot]="true" [hasDefaultSlot]="true">
+      <div title class="flex items-center justify-between w-full pr-4">
+        <h3 class="text-[16px] font-semibold text-ink-gray-9">Keyboard Shortcuts</h3>
+        <div class="relative w-64">
+          <input type="text" [(ngModel)]="searchText" placeholder="Search shortcuts" 
+            class="w-full h-8 px-3 rounded-md border border-outline-gray-2 bg-surface-base text-[13px] text-ink-gray-8 focus:outline-none focus:ring-1 focus:ring-outline-gray-4 focus:border-outline-gray-4 transition-colors">
+        </div>
+      </div>
+
+      <div class="grid grid-cols-1 md:grid-cols-3 gap-10 py-2">
+        @for (category of filteredCategories(); track category.title) {
+          <div class="flex flex-col">
+            <h4 class="text-[13px] font-semibold text-ink-gray-9 mb-3">{{ category.title }}</h4>
+            <div class="flex flex-col gap-3">
+              @for (shortcut of category.shortcuts; track shortcut.label) {
+                <div class="flex justify-between items-center text-[13px] text-ink-gray-6">
+                  <span>{{ shortcut.label }}</span>
+                  <div class="flex items-center gap-1">
+                    <neural-keyboard-shortcut [combo]="shortcut.combo" [bg]="true"></neural-keyboard-shortcut>
+                    
+                    @if (shortcut.alternativeCombo) {
+                      <span class="text-ink-gray-4 text-xs font-mono">/</span>
+                      <neural-keyboard-shortcut 
+                        [combo]="shortcut.alternativeCombo" 
+                        [bg]="true" 
+                        [useIcons]="shortcut.useIcons ?? true">
+                      </neural-keyboard-shortcut>
+                    }
+                  </div>
+                </div>
+              }
+            </div>
+          </div>
+        }
+      </div>
+    </neural-dialog>
+  `
+                }]
+        }], propDecorators: { openModel: [{ type: i0.Input, args: [{ isSignal: true, alias: "openModel", required: false }] }, { type: i0.Output, args: ["openModelChange"] }], categories: [{ type: i0.Input, args: [{ isSignal: true, alias: "categories", required: false }] }] } });
+
 class NeuralThemeSwitcherComponent {
     theme = input('system', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "theme" }] : /* istanbul ignore next */ []));
@@ -14161,5 +14283,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.4", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { NeuralAccordionComponent, NeuralAlertComponent, NeuralAvatarComponent, NeuralAxisChartComponent, NeuralBadgeComponent, NeuralBottomSheetComponent, NeuralBreadcrumbsComponent, NeuralButtonComponent, NeuralCalendarComponent, NeuralCheckboxComponent, NeuralCodeEditorComponent, NeuralCodePreviewComponent, NeuralComboboxComponent, NeuralCommandPaletteComponent, NeuralContextMenuComponent, NeuralDatePickerComponent, NeuralDesktopShellComponent, NeuralDialogComponent, NeuralDividerComponent, NeuralDonutChartComponent, NeuralDropdownComponent, NeuralDurationComponent, NeuralEChartsComponent, NeuralErrorMessageComponent, NeuralFileUploaderComponent, NeuralFilterBuilderComponent, NeuralFloatingWindowComponent, NeuralFooterComponent, NeuralFormControlComponent, NeuralFormLabelComponent, NeuralFunnelChartComponent, NeuralHoverCardComponent, NeuralIconComponent, NeuralInputDescriptionComponent, NeuralInputErrorComponent, NeuralInputLabelComponent, NeuralItemListRowComponent, NeuralKeyboardShortcutComponent, NeuralLabelingWrapperComponent, NeuralListViewComponent, NeuralLoadingIndicatorComponent, NeuralLoadingTextComponent, NeuralMenuComponent, NeuralMobileNavComponent, NeuralMobileNavItemComponent, NeuralMobileShellComponent, NeuralMultiEmailInputComponent, NeuralMultiSelectComponent, NeuralNotificationCenterComponent, NeuralNumberChartComponent, NeuralPageHeaderComponent, NeuralPasswordComponent, NeuralPopoverComponent, NeuralPopoverContentDirective, NeuralPopoverPanelComponent, NeuralPopoverTriggerDirective, NeuralProgressComponent, NeuralRadioComponent, NeuralRadioGroupComponent, NeuralRailComponent, NeuralRailItemComponent, NeuralRatingComponent, NeuralRequiredIndicatorComponent, NeuralScrollAreaComponent, NeuralSearchTriggerComponent, NeuralSelectComponent, NeuralSettingsContentComponent, NeuralSettingsDialogComponent, NeuralSettingsNavItemComponent, NeuralSettingsPanelComponent, NeuralSettingsSidebarComponent, NeuralSidebarComponent, NeuralSidebarItemComponent, NeuralSkeletonComponent, NeuralSliderComponent, NeuralSpinnerComponent, NeuralSwitchComponent, NeuralTabComponent, NeuralTabPanelComponent, NeuralTabsComponent, NeuralTextEditorComponent, NeuralTextInputComponent, NeuralTextareaComponent, NeuralThemeSwitcherComponent, NeuralTimePickerComponent, NeuralToastComponent, NeuralTooltipComponent, NeuralTreeComponent, NeuralTreeItemComponent, RADIO_GROUP, TABS_ROOT, ToastService, formatDuration, parseDuration };
+export { NeuralAccordionComponent, NeuralAlertComponent, NeuralAvatarComponent, NeuralAxisChartComponent, NeuralBadgeComponent, NeuralBottomSheetComponent, NeuralBreadcrumbsComponent, NeuralButtonComponent, NeuralCalendarComponent, NeuralCheckboxComponent, NeuralCodeEditorComponent, NeuralCodePreviewComponent, NeuralComboboxComponent, NeuralCommandPaletteComponent, NeuralContextMenuComponent, NeuralDatePickerComponent, NeuralDesktopShellComponent, NeuralDialogComponent, NeuralDividerComponent, NeuralDonutChartComponent, NeuralDropdownComponent, NeuralDurationComponent, NeuralEChartsComponent, NeuralErrorMessageComponent, NeuralFileUploaderComponent, NeuralFilterBuilderComponent, NeuralFloatingWindowComponent, NeuralFooterComponent, NeuralFormControlComponent, NeuralFormLabelComponent, NeuralFunnelChartComponent, NeuralHoverCardComponent, NeuralIconComponent, NeuralInputDescriptionComponent, NeuralInputErrorComponent, NeuralInputLabelComponent, NeuralItemListRowComponent, NeuralKeyboardShortcutComponent, NeuralKeyboardShortcutsDialogComponent, NeuralLabelingWrapperComponent, NeuralListViewComponent, NeuralLoadingIndicatorComponent, NeuralLoadingTextComponent, NeuralMenuComponent, NeuralMobileNavComponent, NeuralMobileNavItemComponent, NeuralMobileShellComponent, NeuralMultiEmailInputComponent, NeuralMultiSelectComponent, NeuralNotificationCenterComponent, NeuralNumberChartComponent, NeuralPageHeaderComponent, NeuralPasswordComponent, NeuralPopoverComponent, NeuralPopoverContentDirective, NeuralPopoverPanelComponent, NeuralPopoverTriggerDirective, NeuralProgressComponent, NeuralRadioComponent, NeuralRadioGroupComponent, NeuralRailComponent, NeuralRailItemComponent, NeuralRatingComponent, NeuralRequiredIndicatorComponent, NeuralScrollAreaComponent, NeuralSearchTriggerComponent, NeuralSelectComponent, NeuralSettingsContentComponent, NeuralSettingsDialogComponent, NeuralSettingsNavItemComponent, NeuralSettingsPanelComponent, NeuralSettingsSidebarComponent, NeuralSidebarComponent, NeuralSidebarItemComponent, NeuralSkeletonComponent, NeuralSliderComponent, NeuralSpinnerComponent, NeuralSwitchComponent, NeuralTabComponent, NeuralTabPanelComponent, NeuralTabsComponent, NeuralTextEditorComponent, NeuralTextInputComponent, NeuralTextareaComponent, NeuralThemeSwitcherComponent, NeuralTimePickerComponent, NeuralToastComponent, NeuralTooltipComponent, NeuralTreeComponent, NeuralTreeItemComponent, RADIO_GROUP, TABS_ROOT, ToastService, formatDuration, parseDuration };
 //# sourceMappingURL=orbiq-neural-ui-kit.mjs.map