Skip to content

Commit 4d8f73c

Browse files
committed
feat: prevent minus sign typing
1 parent 2ffcfb1 commit 4d8f73c

File tree

2 files changed

+58
-0
lines changed

2 files changed

+58
-0
lines changed

ember-amount-input/src/components/amount-input.ts

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@ import './amount-input.css';
55
const KEY_CODE_E = 69;
66
const KEY_CODE_FULLSTOP = 190;
77
const KEY_CODE_COMMA = 188;
8+
const KEY_CODE_MINUS = '-';
89

910
export interface AmountInputArgs {
1011
/**
@@ -27,6 +28,11 @@ export interface AmountInputArgs {
2728
*/
2829
inputId?: string;
2930

31+
/**
32+
* Specifies if value should be only be integer
33+
*/
34+
integerOnly?: boolean;
35+
3036
/**
3137
* Specifies the minimum value for the input field
3238
*/
@@ -102,6 +108,14 @@ export default class AmountInput extends Component<AmountInputSignature> {
102108
return this.argOrDefault('inputId', 'amount-input');
103109
}
104110

111+
/**
112+
* Specifies if value should be only be integer
113+
* Defaults to false
114+
*/
115+
get integerOnly(): boolean {
116+
return this.argOrDefault('integerOnly', false);
117+
}
118+
105119
/**
106120
* Specifies the number of decimals to use for the amount value.
107121
* Can be >= 0.
@@ -133,6 +147,9 @@ export default class AmountInput extends Component<AmountInputSignature> {
133147
if (event.keyCode === KEY_CODE_E) {
134148
event.preventDefault();
135149
return false;
150+
} else if (this.integerOnly && event.key === KEY_CODE_MINUS) {
151+
event.preventDefault();
152+
return false;
136153
} else if (
137154
this.numberOfDecimal === 0 &&
138155
[KEY_CODE_FULLSTOP, KEY_CODE_COMMA].includes(event.keyCode)

test-app/tests/integration/components/amount-input/component-test.ts

Lines changed: 41 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -222,4 +222,45 @@ module('Integration | Component | amount-input', function (hooks) {
222222
});
223223
});
224224
});
225+
226+
module('positive only values', function () {
227+
test('should not prevent negative values', async function (this: TestContext, assert) {
228+
this.value = null as unknown as number;
229+
230+
await render<TestContext>(hbs`
231+
<AmountInput
232+
@numberOfDecimal={{0}}
233+
@value={{this.value}}
234+
@update={{fn (mut this.value)}}
235+
/>
236+
`);
237+
238+
assert.dom('input').hasValue('');
239+
240+
await fillIn('input', '-1000');
241+
await blur('input');
242+
243+
assert.dom('input').hasValue('-1000');
244+
});
245+
246+
test('should prevent negative values', async function (this: TestContext, assert) {
247+
this.value = 1;
248+
249+
await render<TestContext>(hbs`
250+
<AmountInput
251+
@numberOfDecimal={{0}}
252+
@value={{this.value}}
253+
@update={{fn (mut this.value)}}
254+
@positiveOnly={{true}}
255+
/>
256+
`);
257+
258+
assert.dom('input').hasValue('1');
259+
260+
await typeIn('input', '-1000');
261+
await blur('input');
262+
263+
assert.dom('input').hasValue('1000');
264+
});
265+
});
225266
});

0 commit comments

Comments
 (0)