@neural-ui/core 1.2.0 → 1.3.0

package/fesm2022/neural-ui-core-number-input.mjs

@@ -0,0 +1,331 @@
+import * as i0 from '@angular/core';
+import { input, output, signal, computed, forwardRef, ChangeDetectionStrategy, ViewEncapsulation, Component } from '@angular/core';
+import { NG_VALUE_ACCESSOR } from '@angular/forms';
+
+let _seq = 0;
+/**
+ * NeuralUI NumberInput Component
+ *
+ * Input numérico con botones de incremento/decremento. Implementa CVA.
+ * Soporta layout apilado (stacked), horizontal y vertical.
+ *
+ * Numeric input with increment/decrement buttons. Implements CVA.
+ * Supports stacked, horizontal and vertical layouts.
+ *
+ * Uso: <neu-number-input [min]="0" [max]="99" label="Cantidad" />
+ */
+class NeuNumberInputComponent {
+    /** Valor mínimo / Min value */
+    min = input(-Infinity, ...(ngDevMode ? [{ debugName: "min" }] : /* istanbul ignore next */ []));
+    /** Valor máximo / Max value */
+    max = input(Infinity, ...(ngDevMode ? [{ debugName: "max" }] : /* istanbul ignore next */ []));
+    /** Incremento / Step */
+    step = input(1, ...(ngDevMode ? [{ debugName: "step" }] : /* istanbul ignore next */ []));
+    /** Etiqueta para el input (accesibilidad) / Label for the input (accessibility) */
+    label = input('', ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
+    /** Aria-label del botón de decremento */
+    decrementLabel = input('Disminuir', ...(ngDevMode ? [{ debugName: "decrementLabel" }] : /* istanbul ignore next */ []));
+    /** Aria-label del botón de incremento */
+    incrementLabel = input('Aumentar', ...(ngDevMode ? [{ debugName: "incrementLabel" }] : /* istanbul ignore next */ []));
+    /** Muestra los botones en vertical / Shows buttons vertically */
+    vertical = input(false, ...(ngDevMode ? [{ debugName: "vertical" }] : /* istanbul ignore next */ []));
+    /** Agrupa ambos botones apilados al final del input / Groups both buttons stacked at input end */
+    stacked = input(true, ...(ngDevMode ? [{ debugName: "stacked" }] : /* istanbul ignore next */ []));
+    /** Tamaño del campo: 'sm' = 36px | 'md' = 48px | 'lg' = 56px / Field size */
+    size = input('md', ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
+    /** Emitido en cada cambio / Emitted on each change */
+    valueChange = output();
+    _id = `neu-number-input-${++_seq}`;
+    _cvaDisabled = signal(false, ...(ngDevMode ? [{ debugName: "_cvaDisabled" }] : /* istanbul ignore next */ []));
+    _value = signal(0, ...(ngDevMode ? [{ debugName: "_value" }] : /* istanbul ignore next */ []));
+    hostClasses = computed(() => ({
+        'neu-number-input': true,
+        'neu-number-input--vertical': this.vertical(),
+        'neu-number-input--stacked': this.stacked(),
+        'neu-number-input--disabled': this._cvaDisabled(),
+        'neu-number-input--sm': this.size() === 'sm',
+        'neu-number-input--lg': this.size() === 'lg',
+    }), ...(ngDevMode ? [{ debugName: "hostClasses" }] : /* istanbul ignore next */ []));
+    _onChange = () => { };
+    _onTouched = () => { };
+    writeValue(val) {
+        this._value.set(this._clamp(val ?? 0));
+    }
+    registerOnChange(fn) {
+        this._onChange = fn;
+    }
+    registerOnTouched(fn) {
+        this._onTouched = fn;
+    }
+    setDisabledState(disabled) {
+        this._cvaDisabled.set(disabled);
+    }
+    increment() {
+        this._emit(this._clamp(this._value() + this.step()));
+    }
+    decrement() {
+        this._emit(this._clamp(this._value() - this.step()));
+    }
+    onInputChange(event) {
+        const raw = parseFloat(event.target.value);
+        this._emit(this._clamp(isNaN(raw) ? 0 : raw));
+    }
+    onBlur() {
+        this._onTouched();
+    }
+    _emit(value) {
+        this._value.set(value);
+        this._onChange(value);
+        this.valueChange.emit(value);
+    }
+    _clamp(v) {
+        return Math.min(this.max(), Math.max(this.min(), v));
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: NeuNumberInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.8", type: NeuNumberInputComponent, isStandalone: true, selector: "neu-number-input", inputs: { min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, step: { classPropertyName: "step", publicName: "step", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, decrementLabel: { classPropertyName: "decrementLabel", publicName: "decrementLabel", isSignal: true, isRequired: false, transformFunction: null }, incrementLabel: { classPropertyName: "incrementLabel", publicName: "incrementLabel", isSignal: true, isRequired: false, transformFunction: null }, vertical: { classPropertyName: "vertical", publicName: "vertical", isSignal: true, isRequired: false, transformFunction: null }, stacked: { classPropertyName: "stacked", publicName: "stacked", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange" }, host: { properties: { "class": "hostClasses()" } }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => NeuNumberInputComponent),
+                multi: true,
+            },
+        ], ngImport: i0, template: `
+    @if (label()) {
+      <label class="neu-number-input__label" [for]="_id">{{ label() }}</label>
+    }
+    <div class="neu-number-input__control">
+      @if (vertical()) {
+        <!-- layout vertical: [▲] [input] [▼] -->
+        <button
+          type="button"
+          class="neu-number-input__btn neu-number-input__btn--inc"
+          [disabled]="_cvaDisabled() || _value() >= max()"
+          [attr.aria-label]="incrementLabel()"
+          (click)="increment()"
+        >
+          ▲
+        </button>
+        <input
+          class="neu-number-input__field"
+          type="text"
+          inputmode="numeric"
+          role="spinbutton"
+          [id]="_id"
+          [attr.aria-valuenow]="_value()"
+          [attr.aria-valuemin]="min()"
+          [attr.aria-valuemax]="max()"
+          [disabled]="_cvaDisabled()"
+          [value]="_value()"
+          (change)="onInputChange($event)"
+          (blur)="onBlur()"
+        />
+        <button
+          type="button"
+          class="neu-number-input__btn neu-number-input__btn--dec"
+          [disabled]="_cvaDisabled() || _value() <= min()"
+          [attr.aria-label]="decrementLabel()"
+          (click)="decrement()"
+        >
+          ▼
+        </button>
+      } @else if (stacked()) {
+        <!-- layout apilado: [input | ▲▼ apilados] -->
+        <input
+          class="neu-number-input__field"
+          type="text"
+          inputmode="numeric"
+          role="spinbutton"
+          [id]="_id"
+          [attr.aria-valuenow]="_value()"
+          [attr.aria-valuemin]="min()"
+          [attr.aria-valuemax]="max()"
+          [disabled]="_cvaDisabled()"
+          [value]="_value()"
+          (change)="onInputChange($event)"
+          (blur)="onBlur()"
+        />
+        <span class="neu-number-input__stack">
+          <button
+            type="button"
+            class="neu-number-input__btn neu-number-input__btn--inc"
+            [disabled]="_cvaDisabled() || _value() >= max()"
+            [attr.aria-label]="incrementLabel()"
+            (click)="increment()"
+          >
+            ▲
+          </button>
+          <button
+            type="button"
+            class="neu-number-input__btn neu-number-input__btn--dec"
+            [disabled]="_cvaDisabled() || _value() <= min()"
+            [attr.aria-label]="decrementLabel()"
+            (click)="decrement()"
+          >
+            ▼
+          </button>
+        </span>
+      } @else {
+        <!-- layout horizontal: [−] [input] [+] -->
+        <button
+          type="button"
+          class="neu-number-input__btn neu-number-input__btn--dec"
+          [disabled]="_cvaDisabled() || _value() <= min()"
+          [attr.aria-label]="decrementLabel()"
+          (click)="decrement()"
+        >
+          −
+        </button>
+        <input
+          class="neu-number-input__field"
+          type="text"
+          inputmode="numeric"
+          role="spinbutton"
+          [id]="_id"
+          [attr.aria-valuenow]="_value()"
+          [attr.aria-valuemin]="min()"
+          [attr.aria-valuemax]="max()"
+          [disabled]="_cvaDisabled()"
+          [value]="_value()"
+          (change)="onInputChange($event)"
+          (blur)="onBlur()"
+        />
+        <button
+          type="button"
+          class="neu-number-input__btn neu-number-input__btn--inc"
+          [disabled]="_cvaDisabled() || _value() >= max()"
+          [attr.aria-label]="incrementLabel()"
+          (click)="increment()"
+        >
+          +
+        </button>
+      }
+    </div>
+  `, isInline: true, styles: ["@charset \"UTF-8\";.neu-number-input{display:inline-flex;flex-direction:column;align-items:flex-start;gap:6px}.neu-number-input--disabled{opacity:.5;pointer-events:none}.neu-number-input__label{font-size:var(--neu-text-sm, .875rem);font-weight:500;color:var(--neu-text);line-height:1.4;cursor:pointer}.neu-number-input__control{display:inline-flex;align-items:center;gap:4px}.neu-number-input--vertical .neu-number-input__control{flex-direction:column;gap:0;align-items:stretch;border:1px solid var(--neu-border);border-radius:var(--neu-radius-md, 8px);overflow:hidden;width:var(--neu-number-input-width, 80px)}.neu-number-input--stacked .neu-number-input__control{align-items:stretch;gap:0}.neu-number-input__field{width:var(--neu-number-input-width, 80px);height:var(--neu-number-input-height, 48px);padding:0 8px;border:1px solid var(--neu-border);border-radius:var(--neu-radius-md, 8px);background:var(--neu-surface);color:var(--neu-text);font-size:.9375rem;font-variant-numeric:tabular-nums;text-align:center;outline:none;transition:border-color .15s;-moz-appearance:textfield}.neu-number-input__field::-webkit-inner-spin-button,.neu-number-input__field::-webkit-outer-spin-button{display:none}.neu-number-input__field:focus{border-color:var(--neu-primary);box-shadow:var(--neu-focus-ring)}.neu-number-input--stacked .neu-number-input__field{flex:1 1 auto;width:auto;min-width:var(--neu-number-input-stacked-min-width, 120px);border-radius:var(--neu-radius-md, 8px) 0 0 var(--neu-radius-md, 8px);border-right:none;text-align:left;padding:0 10px}.neu-number-input--vertical .neu-number-input__field{width:100%;border:none;border-top:1px solid var(--neu-border);border-bottom:1px solid var(--neu-border);border-radius:0}.neu-number-input__stack{display:flex;flex-direction:column;border:1px solid var(--neu-border);border-radius:0 var(--neu-radius-md, 8px) var(--neu-radius-md, 8px) 0;overflow:hidden;flex-shrink:0}.neu-number-input__stack .neu-number-input__btn{all:unset;box-sizing:border-box;cursor:pointer;display:flex;align-items:center;justify-content:center;flex:1;width:var(--neu-number-input-btn-size, 26px);border:none;border-radius:0;background:var(--neu-surface);color:var(--neu-text-muted);font-size:.625rem;font-weight:700;line-height:1;transition:background .1s,color .1s}.neu-number-input__stack .neu-number-input__btn:not(:disabled):hover{background:var(--neu-surface-2);color:var(--neu-text)}.neu-number-input__stack .neu-number-input__btn:focus-visible{outline:2px solid var(--neu-primary);outline-offset:-1px}.neu-number-input__stack .neu-number-input__btn:disabled{opacity:.4;cursor:not-allowed}.neu-number-input__stack .neu-number-input__btn--inc{border-bottom:1px solid var(--neu-border)}.neu-number-input__control>.neu-number-input__btn{all:unset;box-sizing:border-box;cursor:pointer;display:flex;align-items:center;justify-content:center;width:var(--neu-number-input-btn-size, 48px);height:var(--neu-number-input-btn-size, 48px);border:1px solid var(--neu-border);border-radius:var(--neu-radius-md, 8px);background:var(--neu-surface);color:var(--neu-text-muted);font-size:.6875rem;line-height:1;transition:background .12s,color .12s,border-color .12s}.neu-number-input__control>.neu-number-input__btn:not(:disabled):hover{background:var(--neu-surface-2);color:var(--neu-text);border-color:var(--neu-primary)}.neu-number-input__control>.neu-number-input__btn:focus-visible{outline:2px solid var(--neu-primary);outline-offset:1px}.neu-number-input__control>.neu-number-input__btn:disabled{opacity:.4;cursor:not-allowed}.neu-number-input--vertical .neu-number-input__control>.neu-number-input__btn{width:100%;border:none;border-radius:0}.neu-number-input--sm{--neu-number-input-height: 36px;--neu-number-input-btn-size: 36px}.neu-number-input--sm .neu-number-input__field{font-size:var(--neu-text-sm)}.neu-number-input--lg{--neu-number-input-height: 56px;--neu-number-input-btn-size: 56px}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: NeuNumberInputComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'neu-number-input', imports: [], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: { '[class]': 'hostClasses()' }, providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => NeuNumberInputComponent),
+                            multi: true,
+                        },
+                    ], template: `
+    @if (label()) {
+      <label class="neu-number-input__label" [for]="_id">{{ label() }}</label>
+    }
+    <div class="neu-number-input__control">
+      @if (vertical()) {
+        <!-- layout vertical: [▲] [input] [▼] -->
+        <button
+          type="button"
+          class="neu-number-input__btn neu-number-input__btn--inc"
+          [disabled]="_cvaDisabled() || _value() >= max()"
+          [attr.aria-label]="incrementLabel()"
+          (click)="increment()"
+        >
+          ▲
+        </button>
+        <input
+          class="neu-number-input__field"
+          type="text"
+          inputmode="numeric"
+          role="spinbutton"
+          [id]="_id"
+          [attr.aria-valuenow]="_value()"
+          [attr.aria-valuemin]="min()"
+          [attr.aria-valuemax]="max()"
+          [disabled]="_cvaDisabled()"
+          [value]="_value()"
+          (change)="onInputChange($event)"
+          (blur)="onBlur()"
+        />
+        <button
+          type="button"
+          class="neu-number-input__btn neu-number-input__btn--dec"
+          [disabled]="_cvaDisabled() || _value() <= min()"
+          [attr.aria-label]="decrementLabel()"
+          (click)="decrement()"
+        >
+          ▼
+        </button>
+      } @else if (stacked()) {
+        <!-- layout apilado: [input | ▲▼ apilados] -->
+        <input
+          class="neu-number-input__field"
+          type="text"
+          inputmode="numeric"
+          role="spinbutton"
+          [id]="_id"
+          [attr.aria-valuenow]="_value()"
+          [attr.aria-valuemin]="min()"
+          [attr.aria-valuemax]="max()"
+          [disabled]="_cvaDisabled()"
+          [value]="_value()"
+          (change)="onInputChange($event)"
+          (blur)="onBlur()"
+        />
+        <span class="neu-number-input__stack">
+          <button
+            type="button"
+            class="neu-number-input__btn neu-number-input__btn--inc"
+            [disabled]="_cvaDisabled() || _value() >= max()"
+            [attr.aria-label]="incrementLabel()"
+            (click)="increment()"
+          >
+            ▲
+          </button>
+          <button
+            type="button"
+            class="neu-number-input__btn neu-number-input__btn--dec"
+            [disabled]="_cvaDisabled() || _value() <= min()"
+            [attr.aria-label]="decrementLabel()"
+            (click)="decrement()"
+          >
+            ▼
+          </button>
+        </span>
+      } @else {
+        <!-- layout horizontal: [−] [input] [+] -->
+        <button
+          type="button"
+          class="neu-number-input__btn neu-number-input__btn--dec"
+          [disabled]="_cvaDisabled() || _value() <= min()"
+          [attr.aria-label]="decrementLabel()"
+          (click)="decrement()"
+        >
+          −
+        </button>
+        <input
+          class="neu-number-input__field"
+          type="text"
+          inputmode="numeric"
+          role="spinbutton"
+          [id]="_id"
+          [attr.aria-valuenow]="_value()"
+          [attr.aria-valuemin]="min()"
+          [attr.aria-valuemax]="max()"
+          [disabled]="_cvaDisabled()"
+          [value]="_value()"
+          (change)="onInputChange($event)"
+          (blur)="onBlur()"
+        />
+        <button
+          type="button"
+          class="neu-number-input__btn neu-number-input__btn--inc"
+          [disabled]="_cvaDisabled() || _value() >= max()"
+          [attr.aria-label]="incrementLabel()"
+          (click)="increment()"
+        >
+          +
+        </button>
+      }
+    </div>
+  `, styles: ["@charset \"UTF-8\";.neu-number-input{display:inline-flex;flex-direction:column;align-items:flex-start;gap:6px}.neu-number-input--disabled{opacity:.5;pointer-events:none}.neu-number-input__label{font-size:var(--neu-text-sm, .875rem);font-weight:500;color:var(--neu-text);line-height:1.4;cursor:pointer}.neu-number-input__control{display:inline-flex;align-items:center;gap:4px}.neu-number-input--vertical .neu-number-input__control{flex-direction:column;gap:0;align-items:stretch;border:1px solid var(--neu-border);border-radius:var(--neu-radius-md, 8px);overflow:hidden;width:var(--neu-number-input-width, 80px)}.neu-number-input--stacked .neu-number-input__control{align-items:stretch;gap:0}.neu-number-input__field{width:var(--neu-number-input-width, 80px);height:var(--neu-number-input-height, 48px);padding:0 8px;border:1px solid var(--neu-border);border-radius:var(--neu-radius-md, 8px);background:var(--neu-surface);color:var(--neu-text);font-size:.9375rem;font-variant-numeric:tabular-nums;text-align:center;outline:none;transition:border-color .15s;-moz-appearance:textfield}.neu-number-input__field::-webkit-inner-spin-button,.neu-number-input__field::-webkit-outer-spin-button{display:none}.neu-number-input__field:focus{border-color:var(--neu-primary);box-shadow:var(--neu-focus-ring)}.neu-number-input--stacked .neu-number-input__field{flex:1 1 auto;width:auto;min-width:var(--neu-number-input-stacked-min-width, 120px);border-radius:var(--neu-radius-md, 8px) 0 0 var(--neu-radius-md, 8px);border-right:none;text-align:left;padding:0 10px}.neu-number-input--vertical .neu-number-input__field{width:100%;border:none;border-top:1px solid var(--neu-border);border-bottom:1px solid var(--neu-border);border-radius:0}.neu-number-input__stack{display:flex;flex-direction:column;border:1px solid var(--neu-border);border-radius:0 var(--neu-radius-md, 8px) var(--neu-radius-md, 8px) 0;overflow:hidden;flex-shrink:0}.neu-number-input__stack .neu-number-input__btn{all:unset;box-sizing:border-box;cursor:pointer;display:flex;align-items:center;justify-content:center;flex:1;width:var(--neu-number-input-btn-size, 26px);border:none;border-radius:0;background:var(--neu-surface);color:var(--neu-text-muted);font-size:.625rem;font-weight:700;line-height:1;transition:background .1s,color .1s}.neu-number-input__stack .neu-number-input__btn:not(:disabled):hover{background:var(--neu-surface-2);color:var(--neu-text)}.neu-number-input__stack .neu-number-input__btn:focus-visible{outline:2px solid var(--neu-primary);outline-offset:-1px}.neu-number-input__stack .neu-number-input__btn:disabled{opacity:.4;cursor:not-allowed}.neu-number-input__stack .neu-number-input__btn--inc{border-bottom:1px solid var(--neu-border)}.neu-number-input__control>.neu-number-input__btn{all:unset;box-sizing:border-box;cursor:pointer;display:flex;align-items:center;justify-content:center;width:var(--neu-number-input-btn-size, 48px);height:var(--neu-number-input-btn-size, 48px);border:1px solid var(--neu-border);border-radius:var(--neu-radius-md, 8px);background:var(--neu-surface);color:var(--neu-text-muted);font-size:.6875rem;line-height:1;transition:background .12s,color .12s,border-color .12s}.neu-number-input__control>.neu-number-input__btn:not(:disabled):hover{background:var(--neu-surface-2);color:var(--neu-text);border-color:var(--neu-primary)}.neu-number-input__control>.neu-number-input__btn:focus-visible{outline:2px solid var(--neu-primary);outline-offset:1px}.neu-number-input__control>.neu-number-input__btn:disabled{opacity:.4;cursor:not-allowed}.neu-number-input--vertical .neu-number-input__control>.neu-number-input__btn{width:100%;border:none;border-radius:0}.neu-number-input--sm{--neu-number-input-height: 36px;--neu-number-input-btn-size: 36px}.neu-number-input--sm .neu-number-input__field{font-size:var(--neu-text-sm)}.neu-number-input--lg{--neu-number-input-height: 56px;--neu-number-input-btn-size: 56px}\n"] }]
+        }], propDecorators: { min: [{ type: i0.Input, args: [{ isSignal: true, alias: "min", required: false }] }], max: [{ type: i0.Input, args: [{ isSignal: true, alias: "max", required: false }] }], step: [{ type: i0.Input, args: [{ isSignal: true, alias: "step", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], decrementLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "decrementLabel", required: false }] }], incrementLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "incrementLabel", required: false }] }], vertical: [{ type: i0.Input, args: [{ isSignal: true, alias: "vertical", required: false }] }], stacked: [{ type: i0.Input, args: [{ isSignal: true, alias: "stacked", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], valueChange: [{ type: i0.Output, args: ["valueChange"] }] } });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { NeuNumberInputComponent };
+//# sourceMappingURL=neural-ui-core-number-input.mjs.map

package/fesm2022/neural-ui-core-number-input.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"neural-ui-core-number-input.mjs","sources":["../../../../projects/ui-core/number-input/neu-number-input.component.ts","../../../../projects/ui-core/number-input/neural-ui-core-number-input.ts"],"sourcesContent":["import {\n  ChangeDetectionStrategy,\n  Component,\n  ViewEncapsulation,\n  computed,\n  forwardRef,\n  input,\n  output,\n  signal,\n} from '@angular/core';\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\n\nlet _seq = 0;\n\n/**\n * NeuralUI NumberInput Component\n *\n * Input numérico con botones de incremento/decremento. Implementa CVA.\n * Soporta layout apilado (stacked), horizontal y vertical.\n *\n * Numeric input with increment/decrement buttons. Implements CVA.\n * Supports stacked, horizontal and vertical layouts.\n *\n * Uso: <neu-number-input [min]=\"0\" [max]=\"99\" label=\"Cantidad\" />\n */\n@Component({\n  selector: 'neu-number-input',\n  imports: [],\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  host: { '[class]': 'hostClasses()' },\n  providers: [\n    {\n      provide: NG_VALUE_ACCESSOR,\n      useExisting: forwardRef(() => NeuNumberInputComponent),\n      multi: true,\n    },\n  ],\n  template: `\n    @if (label()) {\n      <label class=\"neu-number-input__label\" [for]=\"_id\">{{ label() }}</label>\n    }\n    <div class=\"neu-number-input__control\">\n      @if (vertical()) {\n        <!-- layout vertical: [▲] [input] [▼] -->\n        <button\n          type=\"button\"\n          class=\"neu-number-input__btn neu-number-input__btn--inc\"\n          [disabled]=\"_cvaDisabled() || _value() >= max()\"\n          [attr.aria-label]=\"incrementLabel()\"\n          (click)=\"increment()\"\n        >\n          ▲\n        </button>\n        <input\n          class=\"neu-number-input__field\"\n          type=\"text\"\n          inputmode=\"numeric\"\n          role=\"spinbutton\"\n          [id]=\"_id\"\n          [attr.aria-valuenow]=\"_value()\"\n          [attr.aria-valuemin]=\"min()\"\n          [attr.aria-valuemax]=\"max()\"\n          [disabled]=\"_cvaDisabled()\"\n          [value]=\"_value()\"\n          (change)=\"onInputChange($event)\"\n          (blur)=\"onBlur()\"\n        />\n        <button\n          type=\"button\"\n          class=\"neu-number-input__btn neu-number-input__btn--dec\"\n          [disabled]=\"_cvaDisabled() || _value() <= min()\"\n          [attr.aria-label]=\"decrementLabel()\"\n          (click)=\"decrement()\"\n        >\n          ▼\n        </button>\n      } @else if (stacked()) {\n        <!-- layout apilado: [input | ▲▼ apilados] -->\n        <input\n          class=\"neu-number-input__field\"\n          type=\"text\"\n          inputmode=\"numeric\"\n          role=\"spinbutton\"\n          [id]=\"_id\"\n          [attr.aria-valuenow]=\"_value()\"\n          [attr.aria-valuemin]=\"min()\"\n          [attr.aria-valuemax]=\"max()\"\n          [disabled]=\"_cvaDisabled()\"\n          [value]=\"_value()\"\n          (change)=\"onInputChange($event)\"\n          (blur)=\"onBlur()\"\n        />\n        <span class=\"neu-number-input__stack\">\n          <button\n            type=\"button\"\n            class=\"neu-number-input__btn neu-number-input__btn--inc\"\n            [disabled]=\"_cvaDisabled() || _value() >= max()\"\n            [attr.aria-label]=\"incrementLabel()\"\n            (click)=\"increment()\"\n          >\n            ▲\n          </button>\n          <button\n            type=\"button\"\n            class=\"neu-number-input__btn neu-number-input__btn--dec\"\n            [disabled]=\"_cvaDisabled() || _value() <= min()\"\n            [attr.aria-label]=\"decrementLabel()\"\n            (click)=\"decrement()\"\n          >\n            ▼\n          </button>\n        </span>\n      } @else {\n        <!-- layout horizontal: [−] [input] [+] -->\n        <button\n          type=\"button\"\n          class=\"neu-number-input__btn neu-number-input__btn--dec\"\n          [disabled]=\"_cvaDisabled() || _value() <= min()\"\n          [attr.aria-label]=\"decrementLabel()\"\n          (click)=\"decrement()\"\n        >\n          −\n        </button>\n        <input\n          class=\"neu-number-input__field\"\n          type=\"text\"\n          inputmode=\"numeric\"\n          role=\"spinbutton\"\n          [id]=\"_id\"\n          [attr.aria-valuenow]=\"_value()\"\n          [attr.aria-valuemin]=\"min()\"\n          [attr.aria-valuemax]=\"max()\"\n          [disabled]=\"_cvaDisabled()\"\n          [value]=\"_value()\"\n          (change)=\"onInputChange($event)\"\n          (blur)=\"onBlur()\"\n        />\n        <button\n          type=\"button\"\n          class=\"neu-number-input__btn neu-number-input__btn--inc\"\n          [disabled]=\"_cvaDisabled() || _value() >= max()\"\n          [attr.aria-label]=\"incrementLabel()\"\n          (click)=\"increment()\"\n        >\n          +\n        </button>\n      }\n    </div>\n  `,\n  styleUrl: './neu-number-input.component.scss',\n})\nexport class NeuNumberInputComponent implements ControlValueAccessor {\n  /** Valor mínimo / Min value */\n  readonly min = input<number>(-Infinity);\n  /** Valor máximo / Max value */\n  readonly max = input<number>(Infinity);\n  /** Incremento / Step */\n  readonly step = input<number>(1);\n  /** Etiqueta para el input (accesibilidad) / Label for the input (accessibility) */\n  readonly label = input<string>('');\n  /** Aria-label del botón de decremento */\n  readonly decrementLabel = input<string>('Disminuir');\n  /** Aria-label del botón de incremento */\n  readonly incrementLabel = input<string>('Aumentar');\n  /** Muestra los botones en vertical / Shows buttons vertically */\n  readonly vertical = input<boolean>(false);\n  /** Agrupa ambos botones apilados al final del input / Groups both buttons stacked at input end */\n  readonly stacked = input<boolean>(true);\n  /** Tamaño del campo: 'sm' = 36px | 'md' = 48px | 'lg' = 56px / Field size */\n  readonly size = input<'sm' | 'md' | 'lg'>('md');\n  /** Emitido en cada cambio / Emitted on each change */\n  readonly valueChange = output<number>();\n\n  readonly _id = `neu-number-input-${++_seq}`;\n  readonly _cvaDisabled = signal(false);\n  readonly _value = signal(0);\n\n  readonly hostClasses = computed(() => ({\n    'neu-number-input': true,\n    'neu-number-input--vertical': this.vertical(),\n    'neu-number-input--stacked': this.stacked(),\n    'neu-number-input--disabled': this._cvaDisabled(),\n    'neu-number-input--sm': this.size() === 'sm',\n    'neu-number-input--lg': this.size() === 'lg',\n  }));\n\n  private _onChange: (v: number) => void = () => {};\n  private _onTouched: () => void = () => {};\n\n  writeValue(val: number | null): void {\n    this._value.set(this._clamp(val ?? 0));\n  }\n\n  registerOnChange(fn: (v: number) => void): void {\n    this._onChange = fn;\n  }\n  registerOnTouched(fn: () => void): void {\n    this._onTouched = fn;\n  }\n  setDisabledState(disabled: boolean): void {\n    this._cvaDisabled.set(disabled);\n  }\n\n  increment(): void {\n    this._emit(this._clamp(this._value() + this.step()));\n  }\n\n  decrement(): void {\n    this._emit(this._clamp(this._value() - this.step()));\n  }\n\n  onInputChange(event: Event): void {\n    const raw = parseFloat((event.target as HTMLInputElement).value);\n    this._emit(this._clamp(isNaN(raw) ? 0 : raw));\n  }\n\n  onBlur(): void {\n    this._onTouched();\n  }\n\n  private _emit(value: number): void {\n    this._value.set(value);\n    this._onChange(value);\n    this.valueChange.emit(value);\n  }\n\n  private _clamp(v: number): number {\n    return Math.min(this.max(), Math.max(this.min(), v));\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}

package/fesm2022/neural-ui-core-pagination.mjs

@@ -0,0 +1,198 @@
+import * as i0 from '@angular/core';
+import { input, output, computed, ChangeDetectionStrategy, ViewEncapsulation, Component } from '@angular/core';
+
+/**
+ * NeuralUI Pagination Component
+ *
+ * Paginación accesible con navegación por páginas, primera/última y ellipsis.
+ *
+ * Uso:
+ *   <neu-pagination [total]="200" [pageSize]="10" [page]="currentPage"
+ *                  (pageChange)="currentPage = $event" />
+ */
+class NeuPaginationComponent {
+    /** Página actual (1-indexed) / Current page (1-indexed) */
+    page = input(1, ...(ngDevMode ? [{ debugName: "page" }] : /* istanbul ignore next */ []));
+    /** Total de ítems / Total items */
+    total = input(0, ...(ngDevMode ? [{ debugName: "total" }] : /* istanbul ignore next */ []));
+    /** Ítems por página / Items per page */
+    pageSize = input(10, ...(ngDevMode ? [{ debugName: "pageSize" }] : /* istanbul ignore next */ []));
+    /** Número máximo de botones de página visibles (sin contar anterior/siguiente) / Maximum number of visible page buttons (not counting prev/next) */
+    maxVisible = input(7, ...(ngDevMode ? [{ debugName: "maxVisible" }] : /* istanbul ignore next */ []));
+    /** Emite la nueva página al hacer click / Emits the new page on click */
+    pageChange = output();
+    totalPages = computed(() => Math.max(1, Math.ceil(this.total() / this.pageSize())), ...(ngDevMode ? [{ debugName: "totalPages" }] : /* istanbul ignore next */ []));
+    pages = computed(() => {
+        const total = this.totalPages();
+        const current = this.page();
+        const max = this.maxVisible();
+        if (total <= max) {
+            return Array.from({ length: total }, (_, i) => i + 1);
+        }
+        const half = Math.floor(max / 2);
+        let start = Math.max(2, current - half + 1);
+        let end = Math.min(total - 1, start + max - 3);
+        if (end - start < max - 3)
+            start = Math.max(2, end - (max - 4));
+        const result = [1];
+        if (start > 2)
+            result.push(-1);
+        for (let i = start; i <= end; i++)
+            result.push(i);
+        if (end < total - 1)
+            result.push(-1);
+        result.push(total);
+        return result;
+    }, ...(ngDevMode ? [{ debugName: "pages" }] : /* istanbul ignore next */ []));
+    go(page) {
+        const clamped = Math.min(this.totalPages(), Math.max(1, page));
+        if (clamped !== this.page()) {
+            this.pageChange.emit(clamped);
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: NeuPaginationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.8", type: NeuPaginationComponent, isStandalone: true, selector: "neu-pagination", inputs: { page: { classPropertyName: "page", publicName: "page", isSignal: true, isRequired: false, transformFunction: null }, total: { classPropertyName: "total", publicName: "total", isSignal: true, isRequired: false, transformFunction: null }, pageSize: { classPropertyName: "pageSize", publicName: "pageSize", isSignal: true, isRequired: false, transformFunction: null }, maxVisible: { classPropertyName: "maxVisible", publicName: "maxVisible", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { pageChange: "pageChange" }, ngImport: i0, template: `
+    <nav class="neu-pagination" aria-label="Paginación">
+      <!-- Anterior -->
+      <button
+        class="neu-pagination__btn neu-pagination__btn--nav"
+        type="button"
+        [disabled]="page() <= 1"
+        [attr.aria-label]="'Página anterior'"
+        (click)="go(page() - 1)"
+      >
+        <svg
+          width="16"
+          height="16"
+          viewBox="0 0 24 24"
+          fill="none"
+          stroke="currentColor"
+          stroke-width="2"
+          stroke-linecap="round"
+          stroke-linejoin="round"
+          aria-hidden="true"
+        >
+          <polyline points="15 18 9 12 15 6" />
+        </svg>
+      </button>
+
+      <!-- Páginas -->
+      @for (p of pages(); track p) {
+        @if (p === -1) {
+          <span class="neu-pagination__ellipsis" aria-hidden="true">…</span>
+        } @else {
+          <button
+            class="neu-pagination__btn"
+            [class.neu-pagination__btn--active]="p === page()"
+            type="button"
+            [attr.aria-label]="'Página ' + p"
+            [attr.aria-current]="p === page() ? 'page' : null"
+            (click)="go(p)"
+          >
+            {{ p }}
+          </button>
+        }
+      }
+
+      <!-- Siguiente -->
+      <button
+        class="neu-pagination__btn neu-pagination__btn--nav"
+        type="button"
+        [disabled]="page() >= totalPages()"
+        [attr.aria-label]="'Página siguiente'"
+        (click)="go(page() + 1)"
+      >
+        <svg
+          width="16"
+          height="16"
+          viewBox="0 0 24 24"
+          fill="none"
+          stroke="currentColor"
+          stroke-width="2"
+          stroke-linecap="round"
+          stroke-linejoin="round"
+          aria-hidden="true"
+        >
+          <polyline points="9 18 15 12 9 6" />
+        </svg>
+      </button>
+    </nav>
+  `, isInline: true, styles: [".neu-pagination{display:inline-flex;align-items:center;gap:4px;font-family:var(--neu-font-sans)}.neu-pagination__btn{display:inline-flex;align-items:center;justify-content:center;min-width:36px;height:36px;padding:0 6px;border:1.5px solid var(--neu-border);border-radius:var(--neu-radius);background:var(--neu-surface);font-family:var(--neu-font-sans);font-size:var(--neu-text-sm);font-weight:500;color:var(--neu-text-muted);cursor:pointer;transition:background var(--neu-transition),border-color var(--neu-transition),color var(--neu-transition);outline:none}.neu-pagination__btn:hover:not(:disabled){background:var(--neu-surface-2);border-color:var(--neu-border-hover);color:var(--neu-text)}.neu-pagination__btn:focus-visible{outline:2px solid var(--neu-primary);outline-offset:2px}.neu-pagination__btn--active{background:var(--neu-primary);border-color:var(--neu-primary);color:var(--neu-primary-fg);font-weight:600}.neu-pagination__btn--active:hover{background:var(--neu-primary-dark);border-color:var(--neu-primary-dark)}.neu-pagination__btn--nav{color:var(--neu-text-muted)}.neu-pagination__btn:disabled{opacity:.35;cursor:not-allowed}.neu-pagination__ellipsis{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;font-size:var(--neu-text-sm);color:var(--neu-text-disabled);-webkit-user-select:none;user-select:none}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: NeuPaginationComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'neu-pagination', imports: [], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: `
+    <nav class="neu-pagination" aria-label="Paginación">
+      <!-- Anterior -->
+      <button
+        class="neu-pagination__btn neu-pagination__btn--nav"
+        type="button"
+        [disabled]="page() <= 1"
+        [attr.aria-label]="'Página anterior'"
+        (click)="go(page() - 1)"
+      >
+        <svg
+          width="16"
+          height="16"
+          viewBox="0 0 24 24"
+          fill="none"
+          stroke="currentColor"
+          stroke-width="2"
+          stroke-linecap="round"
+          stroke-linejoin="round"
+          aria-hidden="true"
+        >
+          <polyline points="15 18 9 12 15 6" />
+        </svg>
+      </button>
+
+      <!-- Páginas -->
+      @for (p of pages(); track p) {
+        @if (p === -1) {
+          <span class="neu-pagination__ellipsis" aria-hidden="true">…</span>
+        } @else {
+          <button
+            class="neu-pagination__btn"
+            [class.neu-pagination__btn--active]="p === page()"
+            type="button"
+            [attr.aria-label]="'Página ' + p"
+            [attr.aria-current]="p === page() ? 'page' : null"
+            (click)="go(p)"
+          >
+            {{ p }}
+          </button>
+        }
+      }
+
+      <!-- Siguiente -->
+      <button
+        class="neu-pagination__btn neu-pagination__btn--nav"
+        type="button"
+        [disabled]="page() >= totalPages()"
+        [attr.aria-label]="'Página siguiente'"
+        (click)="go(page() + 1)"
+      >
+        <svg
+          width="16"
+          height="16"
+          viewBox="0 0 24 24"
+          fill="none"
+          stroke="currentColor"
+          stroke-width="2"
+          stroke-linecap="round"
+          stroke-linejoin="round"
+          aria-hidden="true"
+        >
+          <polyline points="9 18 15 12 9 6" />
+        </svg>
+      </button>
+    </nav>
+  `, styles: [".neu-pagination{display:inline-flex;align-items:center;gap:4px;font-family:var(--neu-font-sans)}.neu-pagination__btn{display:inline-flex;align-items:center;justify-content:center;min-width:36px;height:36px;padding:0 6px;border:1.5px solid var(--neu-border);border-radius:var(--neu-radius);background:var(--neu-surface);font-family:var(--neu-font-sans);font-size:var(--neu-text-sm);font-weight:500;color:var(--neu-text-muted);cursor:pointer;transition:background var(--neu-transition),border-color var(--neu-transition),color var(--neu-transition);outline:none}.neu-pagination__btn:hover:not(:disabled){background:var(--neu-surface-2);border-color:var(--neu-border-hover);color:var(--neu-text)}.neu-pagination__btn:focus-visible{outline:2px solid var(--neu-primary);outline-offset:2px}.neu-pagination__btn--active{background:var(--neu-primary);border-color:var(--neu-primary);color:var(--neu-primary-fg);font-weight:600}.neu-pagination__btn--active:hover{background:var(--neu-primary-dark);border-color:var(--neu-primary-dark)}.neu-pagination__btn--nav{color:var(--neu-text-muted)}.neu-pagination__btn:disabled{opacity:.35;cursor:not-allowed}.neu-pagination__ellipsis{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;font-size:var(--neu-text-sm);color:var(--neu-text-disabled);-webkit-user-select:none;user-select:none}\n"] }]
+        }], propDecorators: { page: [{ type: i0.Input, args: [{ isSignal: true, alias: "page", required: false }] }], total: [{ type: i0.Input, args: [{ isSignal: true, alias: "total", required: false }] }], pageSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "pageSize", required: false }] }], maxVisible: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxVisible", required: false }] }], pageChange: [{ type: i0.Output, args: ["pageChange"] }] } });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { NeuPaginationComponent };
+//# sourceMappingURL=neural-ui-core-pagination.mjs.map

package/fesm2022/neural-ui-core-pagination.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"neural-ui-core-pagination.mjs","sources":["../../../../projects/ui-core/pagination/neu-pagination.component.ts","../../../../projects/ui-core/pagination/neural-ui-core-pagination.ts"],"sourcesContent":["import {\n  ChangeDetectionStrategy,\n  Component,\n  ViewEncapsulation,\n  computed,\n  input,\n  output,\n} from '@angular/core';\n\n/**\n * NeuralUI Pagination Component\n *\n * Paginación accesible con navegación por páginas, primera/última y ellipsis.\n *\n * Uso:\n *   <neu-pagination [total]=\"200\" [pageSize]=\"10\" [page]=\"currentPage\"\n *                  (pageChange)=\"currentPage = $event\" />\n */\n@Component({\n  selector: 'neu-pagination',\n  imports: [],\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  template: `\n    <nav class=\"neu-pagination\" aria-label=\"Paginación\">\n      <!-- Anterior -->\n      <button\n        class=\"neu-pagination__btn neu-pagination__btn--nav\"\n        type=\"button\"\n        [disabled]=\"page() <= 1\"\n        [attr.aria-label]=\"'Página anterior'\"\n        (click)=\"go(page() - 1)\"\n      >\n        <svg\n          width=\"16\"\n          height=\"16\"\n          viewBox=\"0 0 24 24\"\n          fill=\"none\"\n          stroke=\"currentColor\"\n          stroke-width=\"2\"\n          stroke-linecap=\"round\"\n          stroke-linejoin=\"round\"\n          aria-hidden=\"true\"\n        >\n          <polyline points=\"15 18 9 12 15 6\" />\n        </svg>\n      </button>\n\n      <!-- Páginas -->\n      @for (p of pages(); track p) {\n        @if (p === -1) {\n          <span class=\"neu-pagination__ellipsis\" aria-hidden=\"true\">…</span>\n        } @else {\n          <button\n            class=\"neu-pagination__btn\"\n            [class.neu-pagination__btn--active]=\"p === page()\"\n            type=\"button\"\n            [attr.aria-label]=\"'Página ' + p\"\n            [attr.aria-current]=\"p === page() ? 'page' : null\"\n            (click)=\"go(p)\"\n          >\n            {{ p }}\n          </button>\n        }\n      }\n\n      <!-- Siguiente -->\n      <button\n        class=\"neu-pagination__btn neu-pagination__btn--nav\"\n        type=\"button\"\n        [disabled]=\"page() >= totalPages()\"\n        [attr.aria-label]=\"'Página siguiente'\"\n        (click)=\"go(page() + 1)\"\n      >\n        <svg\n          width=\"16\"\n          height=\"16\"\n          viewBox=\"0 0 24 24\"\n          fill=\"none\"\n          stroke=\"currentColor\"\n          stroke-width=\"2\"\n          stroke-linecap=\"round\"\n          stroke-linejoin=\"round\"\n          aria-hidden=\"true\"\n        >\n          <polyline points=\"9 18 15 12 9 6\" />\n        </svg>\n      </button>\n    </nav>\n  `,\n  styleUrl: './neu-pagination.component.scss',\n})\nexport class NeuPaginationComponent {\n  /** Página actual (1-indexed) / Current page (1-indexed) */\n  page = input<number>(1);\n\n  /** Total de ítems / Total items */\n  total = input<number>(0);\n\n  /** Ítems por página / Items per page */\n  pageSize = input<number>(10);\n\n  /** Número máximo de botones de página visibles (sin contar anterior/siguiente) / Maximum number of visible page buttons (not counting prev/next) */\n  maxVisible = input<number>(7);\n\n  /** Emite la nueva página al hacer click / Emits the new page on click */\n  pageChange = output<number>();\n\n  readonly totalPages = computed(() => Math.max(1, Math.ceil(this.total() / this.pageSize())));\n\n  readonly pages = computed((): (number | -1)[] => {\n    const total = this.totalPages();\n    const current = this.page();\n    const max = this.maxVisible();\n\n    if (total <= max) {\n      return Array.from({ length: total }, (_, i) => i + 1);\n    }\n\n    const half = Math.floor(max / 2);\n    let start = Math.max(2, current - half + 1);\n    let end = Math.min(total - 1, start + max - 3);\n    if (end - start < max - 3) start = Math.max(2, end - (max - 4));\n\n    const result: (number | -1)[] = [1];\n    if (start > 2) result.push(-1);\n    for (let i = start; i <= end; i++) result.push(i);\n    if (end < total - 1) result.push(-1);\n    result.push(total);\n    return result;\n  });\n\n  go(page: number): void {\n    const clamped = Math.min(this.totalPages(), Math.max(1, page));\n    if (clamped !== this.page()) {\n      this.pageChange.emit(clamped);\n    }\n  }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}