@neural-ui/core 1.5.5 → 1.5.6
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.
|
@@ -23,6 +23,8 @@ class NeuNumberInputComponent {
|
|
|
23
23
|
step = input(1, ...(ngDevMode ? [{ debugName: "step" }] : /* istanbul ignore next */ []));
|
|
24
24
|
/** Etiqueta para el input (accesibilidad) / Label for the input (accessibility) */
|
|
25
25
|
label = input('', ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
|
|
26
|
+
/** Muestra el label como flotante dentro del campo / Shows the label as floating inside the field */
|
|
27
|
+
floatingLabel = input(false, ...(ngDevMode ? [{ debugName: "floatingLabel" }] : /* istanbul ignore next */ []));
|
|
26
28
|
/** Aria-label del botón de decremento */
|
|
27
29
|
decrementLabel = input('Disminuir', ...(ngDevMode ? [{ debugName: "decrementLabel" }] : /* istanbul ignore next */ []));
|
|
28
30
|
/** Aria-label del botón de incremento */
|
|
@@ -38,10 +40,13 @@ class NeuNumberInputComponent {
|
|
|
38
40
|
_id = `neu-number-input-${++_seq}`;
|
|
39
41
|
_cvaDisabled = signal(false, ...(ngDevMode ? [{ debugName: "_cvaDisabled" }] : /* istanbul ignore next */ []));
|
|
40
42
|
_value = signal(0, ...(ngDevMode ? [{ debugName: "_value" }] : /* istanbul ignore next */ []));
|
|
43
|
+
_focused = signal(false, ...(ngDevMode ? [{ debugName: "_focused" }] : /* istanbul ignore next */ []));
|
|
44
|
+
hasValue = computed(() => Number.isFinite(this._value()), ...(ngDevMode ? [{ debugName: "hasValue" }] : /* istanbul ignore next */ []));
|
|
41
45
|
hostClasses = computed(() => ({
|
|
42
46
|
'neu-number-input': true,
|
|
43
47
|
'neu-number-input--vertical': this.vertical(),
|
|
44
48
|
'neu-number-input--stacked': this.stacked(),
|
|
49
|
+
'neu-number-input--horizontal': !this.vertical() && !this.stacked(),
|
|
45
50
|
'neu-number-input--disabled': this._cvaDisabled(),
|
|
46
51
|
'neu-number-input--sm': this.size() === 'sm',
|
|
47
52
|
'neu-number-input--lg': this.size() === 'lg',
|
|
@@ -70,7 +75,11 @@ class NeuNumberInputComponent {
|
|
|
70
75
|
const raw = parseFloat(event.target.value);
|
|
71
76
|
this._emit(this._clamp(isNaN(raw) ? 0 : raw));
|
|
72
77
|
}
|
|
78
|
+
onFocus() {
|
|
79
|
+
this._focused.set(true);
|
|
80
|
+
}
|
|
73
81
|
onBlur() {
|
|
82
|
+
this._focused.set(false);
|
|
74
83
|
this._onTouched();
|
|
75
84
|
}
|
|
76
85
|
_emit(value) {
|
|
@@ -82,17 +91,22 @@ class NeuNumberInputComponent {
|
|
|
82
91
|
return Math.min(this.max(), Math.max(this.min(), v));
|
|
83
92
|
}
|
|
84
93
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: NeuNumberInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
85
|
-
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: [
|
|
94
|
+
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 }, floatingLabel: { classPropertyName: "floatingLabel", publicName: "floatingLabel", 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: [
|
|
86
95
|
{
|
|
87
96
|
provide: NG_VALUE_ACCESSOR,
|
|
88
97
|
useExisting: forwardRef(() => NeuNumberInputComponent),
|
|
89
98
|
multi: true,
|
|
90
99
|
},
|
|
91
100
|
], ngImport: i0, template: `
|
|
92
|
-
@if (label()) {
|
|
101
|
+
@if (!floatingLabel() && label()) {
|
|
93
102
|
<label class="neu-number-input__label" [for]="_id">{{ label() }}</label>
|
|
94
103
|
}
|
|
95
|
-
<div
|
|
104
|
+
<div
|
|
105
|
+
class="neu-number-input__control"
|
|
106
|
+
[class.neu-number-input__control--focused]="_focused()"
|
|
107
|
+
[class.neu-number-input__control--has-value]="hasValue()"
|
|
108
|
+
[class.neu-number-input__control--no-float]="!floatingLabel()"
|
|
109
|
+
>
|
|
96
110
|
@if (vertical()) {
|
|
97
111
|
<!-- layout vertical: [▲] [input] [▼] -->
|
|
98
112
|
<button
|
|
@@ -116,6 +130,7 @@ class NeuNumberInputComponent {
|
|
|
116
130
|
[disabled]="_cvaDisabled()"
|
|
117
131
|
[value]="_value()"
|
|
118
132
|
(change)="onInputChange($event)"
|
|
133
|
+
(focus)="onFocus()"
|
|
119
134
|
(blur)="onBlur()"
|
|
120
135
|
/>
|
|
121
136
|
<button
|
|
@@ -141,6 +156,7 @@ class NeuNumberInputComponent {
|
|
|
141
156
|
[disabled]="_cvaDisabled()"
|
|
142
157
|
[value]="_value()"
|
|
143
158
|
(change)="onInputChange($event)"
|
|
159
|
+
(focus)="onFocus()"
|
|
144
160
|
(blur)="onBlur()"
|
|
145
161
|
/>
|
|
146
162
|
<span class="neu-number-input__stack">
|
|
@@ -186,6 +202,7 @@ class NeuNumberInputComponent {
|
|
|
186
202
|
[disabled]="_cvaDisabled()"
|
|
187
203
|
[value]="_value()"
|
|
188
204
|
(change)="onInputChange($event)"
|
|
205
|
+
(focus)="onFocus()"
|
|
189
206
|
(blur)="onBlur()"
|
|
190
207
|
/>
|
|
191
208
|
<button
|
|
@@ -198,8 +215,12 @@ class NeuNumberInputComponent {
|
|
|
198
215
|
+
|
|
199
216
|
</button>
|
|
200
217
|
}
|
|
218
|
+
|
|
219
|
+
@if (floatingLabel() && label()) {
|
|
220
|
+
<label class="neu-number-input__floating-label" [for]="_id">{{ label() }}</label>
|
|
221
|
+
}
|
|
201
222
|
</div>
|
|
202
|
-
`, 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--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--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--vertical .neu-number-input__control>.neu-number-input__btn{width:100%;border:none;border-radius:0}.neu-number-input--stacked .neu-number-input__control{align-items:stretch;gap:0}.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--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}.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__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__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}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
223
|
+
`, 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--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--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--vertical .neu-number-input__control>.neu-number-input__btn{width:100%;border:none;border-radius:0}.neu-number-input--vertical .neu-number-input__floating-label{left:10px;max-width:calc(100% - 20px)}.neu-number-input--stacked .neu-number-input__control{align-items:stretch;gap:0}.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--horizontal .neu-number-input__floating-label{left:calc(var(--neu-number-input-btn-size, 48px) + 12px);max-width:calc(100% - var(--neu-number-input-btn-size, 48px) * 2 - 28px)}.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}.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{position:relative;display:inline-flex;align-items:center;gap:4px}.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__floating-label{position:absolute;left:6px;top:50%;z-index:1;transform:translateY(-50%);max-width:calc(100% - var(--neu-number-input-btn-size, 26px) - 18px);padding:0 4px;overflow:hidden;color:var(--neu-text-muted);font-size:var(--neu-text-base, 1rem);line-height:1.2;pointer-events:none;text-overflow:ellipsis;transition:top var(--neu-transition),color var(--neu-transition),font-size var(--neu-transition),transform var(--neu-transition),background var(--neu-transition);white-space:nowrap}.neu-number-input__control--focused .neu-number-input__floating-label,.neu-number-input__control--has-value .neu-number-input__floating-label{top:0;transform:translateY(-50%);background:var(--neu-surface);color:var(--neu-text-muted);font-size:12px;font-weight:600}.neu-number-input__control--focused .neu-number-input__floating-label{color:var(--neu-primary)}.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}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
203
224
|
}
|
|
204
225
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: NeuNumberInputComponent, decorators: [{
|
|
205
226
|
type: Component,
|
|
@@ -210,10 +231,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImpor
|
|
|
210
231
|
multi: true,
|
|
211
232
|
},
|
|
212
233
|
], template: `
|
|
213
|
-
@if (label()) {
|
|
234
|
+
@if (!floatingLabel() && label()) {
|
|
214
235
|
<label class="neu-number-input__label" [for]="_id">{{ label() }}</label>
|
|
215
236
|
}
|
|
216
|
-
<div
|
|
237
|
+
<div
|
|
238
|
+
class="neu-number-input__control"
|
|
239
|
+
[class.neu-number-input__control--focused]="_focused()"
|
|
240
|
+
[class.neu-number-input__control--has-value]="hasValue()"
|
|
241
|
+
[class.neu-number-input__control--no-float]="!floatingLabel()"
|
|
242
|
+
>
|
|
217
243
|
@if (vertical()) {
|
|
218
244
|
<!-- layout vertical: [▲] [input] [▼] -->
|
|
219
245
|
<button
|
|
@@ -237,6 +263,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImpor
|
|
|
237
263
|
[disabled]="_cvaDisabled()"
|
|
238
264
|
[value]="_value()"
|
|
239
265
|
(change)="onInputChange($event)"
|
|
266
|
+
(focus)="onFocus()"
|
|
240
267
|
(blur)="onBlur()"
|
|
241
268
|
/>
|
|
242
269
|
<button
|
|
@@ -262,6 +289,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImpor
|
|
|
262
289
|
[disabled]="_cvaDisabled()"
|
|
263
290
|
[value]="_value()"
|
|
264
291
|
(change)="onInputChange($event)"
|
|
292
|
+
(focus)="onFocus()"
|
|
265
293
|
(blur)="onBlur()"
|
|
266
294
|
/>
|
|
267
295
|
<span class="neu-number-input__stack">
|
|
@@ -307,6 +335,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImpor
|
|
|
307
335
|
[disabled]="_cvaDisabled()"
|
|
308
336
|
[value]="_value()"
|
|
309
337
|
(change)="onInputChange($event)"
|
|
338
|
+
(focus)="onFocus()"
|
|
310
339
|
(blur)="onBlur()"
|
|
311
340
|
/>
|
|
312
341
|
<button
|
|
@@ -319,9 +348,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImpor
|
|
|
319
348
|
+
|
|
320
349
|
</button>
|
|
321
350
|
}
|
|
351
|
+
|
|
352
|
+
@if (floatingLabel() && label()) {
|
|
353
|
+
<label class="neu-number-input__floating-label" [for]="_id">{{ label() }}</label>
|
|
354
|
+
}
|
|
322
355
|
</div>
|
|
323
|
-
`, 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--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--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--vertical .neu-number-input__control>.neu-number-input__btn{width:100%;border:none;border-radius:0}.neu-number-input--stacked .neu-number-input__control{align-items:stretch;gap:0}.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--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}.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__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__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}\n"] }]
|
|
324
|
-
}], 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"] }] } });
|
|
356
|
+
`, 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--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--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--vertical .neu-number-input__control>.neu-number-input__btn{width:100%;border:none;border-radius:0}.neu-number-input--vertical .neu-number-input__floating-label{left:10px;max-width:calc(100% - 20px)}.neu-number-input--stacked .neu-number-input__control{align-items:stretch;gap:0}.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--horizontal .neu-number-input__floating-label{left:calc(var(--neu-number-input-btn-size, 48px) + 12px);max-width:calc(100% - var(--neu-number-input-btn-size, 48px) * 2 - 28px)}.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}.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{position:relative;display:inline-flex;align-items:center;gap:4px}.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__floating-label{position:absolute;left:6px;top:50%;z-index:1;transform:translateY(-50%);max-width:calc(100% - var(--neu-number-input-btn-size, 26px) - 18px);padding:0 4px;overflow:hidden;color:var(--neu-text-muted);font-size:var(--neu-text-base, 1rem);line-height:1.2;pointer-events:none;text-overflow:ellipsis;transition:top var(--neu-transition),color var(--neu-transition),font-size var(--neu-transition),transform var(--neu-transition),background var(--neu-transition);white-space:nowrap}.neu-number-input__control--focused .neu-number-input__floating-label,.neu-number-input__control--has-value .neu-number-input__floating-label{top:0;transform:translateY(-50%);background:var(--neu-surface);color:var(--neu-text-muted);font-size:12px;font-weight:600}.neu-number-input__control--focused .neu-number-input__floating-label{color:var(--neu-primary)}.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}\n"] }]
|
|
357
|
+
}], 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 }] }], floatingLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "floatingLabel", 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"] }] } });
|
|
325
358
|
|
|
326
359
|
/**
|
|
327
360
|
* Generated bundle index. Do not edit.
|
|
@@ -1 +1 @@
|
|
|
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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"}
|
|
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 (!floatingLabel() && label()) {\n <label class=\"neu-number-input__label\" [for]=\"_id\">{{ label() }}</label>\n }\n <div\n class=\"neu-number-input__control\"\n [class.neu-number-input__control--focused]=\"_focused()\"\n [class.neu-number-input__control--has-value]=\"hasValue()\"\n [class.neu-number-input__control--no-float]=\"!floatingLabel()\"\n >\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 (focus)=\"onFocus()\"\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 (focus)=\"onFocus()\"\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 (focus)=\"onFocus()\"\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\n @if (floatingLabel() && label()) {\n <label class=\"neu-number-input__floating-label\" [for]=\"_id\">{{ label() }}</label>\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 /** Muestra el label como flotante dentro del campo / Shows the label as floating inside the field */\n readonly floatingLabel = input<boolean>(false);\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 readonly _focused = signal(false);\n\n readonly hasValue = computed(() => Number.isFinite(this._value()));\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--horizontal': !this.vertical() && !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 onFocus(): void {\n this._focused.set(true);\n }\n\n onBlur(): void {\n this._focused.set(false);\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/package.json
CHANGED
|
@@ -21,6 +21,8 @@ declare class NeuNumberInputComponent implements ControlValueAccessor {
|
|
|
21
21
|
readonly step: _angular_core.InputSignal<number>;
|
|
22
22
|
/** Etiqueta para el input (accesibilidad) / Label for the input (accessibility) */
|
|
23
23
|
readonly label: _angular_core.InputSignal<string>;
|
|
24
|
+
/** Muestra el label como flotante dentro del campo / Shows the label as floating inside the field */
|
|
25
|
+
readonly floatingLabel: _angular_core.InputSignal<boolean>;
|
|
24
26
|
/** Aria-label del botón de decremento */
|
|
25
27
|
readonly decrementLabel: _angular_core.InputSignal<string>;
|
|
26
28
|
/** Aria-label del botón de incremento */
|
|
@@ -36,10 +38,13 @@ declare class NeuNumberInputComponent implements ControlValueAccessor {
|
|
|
36
38
|
readonly _id: string;
|
|
37
39
|
readonly _cvaDisabled: _angular_core.WritableSignal<boolean>;
|
|
38
40
|
readonly _value: _angular_core.WritableSignal<number>;
|
|
41
|
+
readonly _focused: _angular_core.WritableSignal<boolean>;
|
|
42
|
+
readonly hasValue: _angular_core.Signal<boolean>;
|
|
39
43
|
readonly hostClasses: _angular_core.Signal<{
|
|
40
44
|
'neu-number-input': boolean;
|
|
41
45
|
'neu-number-input--vertical': boolean;
|
|
42
46
|
'neu-number-input--stacked': boolean;
|
|
47
|
+
'neu-number-input--horizontal': boolean;
|
|
43
48
|
'neu-number-input--disabled': boolean;
|
|
44
49
|
'neu-number-input--sm': boolean;
|
|
45
50
|
'neu-number-input--lg': boolean;
|
|
@@ -53,11 +58,12 @@ declare class NeuNumberInputComponent implements ControlValueAccessor {
|
|
|
53
58
|
increment(): void;
|
|
54
59
|
decrement(): void;
|
|
55
60
|
onInputChange(event: Event): void;
|
|
61
|
+
onFocus(): void;
|
|
56
62
|
onBlur(): void;
|
|
57
63
|
private _emit;
|
|
58
64
|
private _clamp;
|
|
59
65
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<NeuNumberInputComponent, never>;
|
|
60
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<NeuNumberInputComponent, "neu-number-input", never, { "min": { "alias": "min"; "required": false; "isSignal": true; }; "max": { "alias": "max"; "required": false; "isSignal": true; }; "step": { "alias": "step"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "decrementLabel": { "alias": "decrementLabel"; "required": false; "isSignal": true; }; "incrementLabel": { "alias": "incrementLabel"; "required": false; "isSignal": true; }; "vertical": { "alias": "vertical"; "required": false; "isSignal": true; }; "stacked": { "alias": "stacked"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; }, { "valueChange": "valueChange"; }, never, never, true, never>;
|
|
66
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<NeuNumberInputComponent, "neu-number-input", never, { "min": { "alias": "min"; "required": false; "isSignal": true; }; "max": { "alias": "max"; "required": false; "isSignal": true; }; "step": { "alias": "step"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "floatingLabel": { "alias": "floatingLabel"; "required": false; "isSignal": true; }; "decrementLabel": { "alias": "decrementLabel"; "required": false; "isSignal": true; }; "incrementLabel": { "alias": "incrementLabel"; "required": false; "isSignal": true; }; "vertical": { "alias": "vertical"; "required": false; "isSignal": true; }; "stacked": { "alias": "stacked"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; }, { "valueChange": "valueChange"; }, never, never, true, never>;
|
|
61
67
|
}
|
|
62
68
|
|
|
63
69
|
export { NeuNumberInputComponent };
|