Skip to content

Commit

Permalink
fix: remove any instances of type=numeric #120
Browse files Browse the repository at this point in the history
  • Loading branch information
jordanjones243 committed Dec 18, 2024
1 parent 39d8ea3 commit 419d8ae
Show file tree
Hide file tree
Showing 6 changed files with 23 additions and 23 deletions.
File renamed without changes.
File renamed without changes.
4 changes: 2 additions & 2 deletions components/input/docs/api.md
Original file line number Diff line number Diff line change
Expand Up @@ -27,9 +27,9 @@ Generate unique names for dependency components.
| `isValid` | `isValid` | `String` | false | (DEPRECATED - Please use validity) Can be accessed to determine if the input validity. Returns true when validity has not yet been checked or validity = 'valid', all other cases return false. Not intended to be set by the consumer. |
| `label` | `label` | `String` | "Input label is undefined" | Deprecated, see `slot`. |
| `lang` | `lang` | `String` | | defines the language of an element. |
| `max` | `max` | `String` | "undefined" | The maximum value allowed. This only applies for inputs with a type of `numeric` and all date formats. |
| `max` | `max` | `String` | "undefined" | The maximum value allowed. This only applies for inputs with a type of `number` and all date formats. |
| `maxLength` | `maxLength` | `Number` | "undefined" | The maximum number of characters the user can enter into the text input. This must be an integer value `0` or higher. |
| `min` | `min` | `String` | "undefined" | The minimum value allowed. This only applies for inputs with a type of `numeric` and all date formats. |
| `min` | `min` | `String` | "undefined" | The minimum value allowed. This only applies for inputs with a type of `number` and all date formats. |
| `minLength` | `minLength` | `Number` | "undefined" | The minimum number of characters the user can enter into the text input. This must be an non-negative integer value smaller than or equal to the value specified by `maxlength`. |
| `name` | `name` | `String` | | Populates the `name` attribute on the input. |
| `noValidate` | `noValidate` | `Boolean` | false | If set, disables auto-validation on blur. |
Expand Down
16 changes: 8 additions & 8 deletions components/input/docs/partials/api.md
Original file line number Diff line number Diff line change
Expand Up @@ -123,7 +123,7 @@ Note: Setting the `value` to `undefined` will also reset the element.

### Max <a name="max"></a>

Use the `max` attribute to define a maximum value used during validation. The attribute will only apply when `<auro-input>` also has a `type` attribute for `numeric` or any date format.
Use the `max` attribute to define a maximum value used during validation. The attribute will only apply when `<auro-input>` also has a `type` attribute for `number` or any date format.

The `max` attribute should be used in combination with the `setCustomValidityRangeOverflow` attribute to define help text used when the `max` attribute validation fails.

Expand All @@ -142,24 +142,24 @@ The `max` attribute should be used in combination with the `setCustomValidityRan

</auro-accordion>

#### Numeric Example
#### Number Example

<div class="exampleWrapper">
<!-- AURO-GENERATED-CONTENT:START (FILE:src=../apiExamples/maxNumeric.html) -->
<!-- AURO-GENERATED-CONTENT:START (FILE:src=../apiExamples/maxNumber.html) -->
<!-- AURO-GENERATED-CONTENT:END -->
</div>

<auro-accordion alignRight>
<span slot="trigger">See code</span>

<!-- AURO-GENERATED-CONTENT:START (CODE:src=../apiExamples/maxNumeric.html) -->
<!-- AURO-GENERATED-CONTENT:START (CODE:src=../apiExamples/maxNumber.html) -->
<!-- AURO-GENERATED-CONTENT:END -->

</auro-accordion>

### Min <a name="min"></a>

Use the `min` attribute to define a minimum value used during validation. The attribute will only apply when `<auro-input>` also has a `type` attribute for numeric or any date format.
Use the `min` attribute to define a minimum value used during validation. The attribute will only apply when `<auro-input>` also has a `type` attribute for `number` or any date format.

The `min` attribute should be used in combination with the `setCustomValidityRangeUnderflow` attribute to define help text used when the `min` attribute validation fails.

Expand All @@ -178,17 +178,17 @@ The `min` attribute should be used in combination with the `setCustomValidityRan

</auro-accordion>

#### Numeric Example
#### Number Example

<div class="exampleWrapper">
<!-- AURO-GENERATED-CONTENT:START (FILE:src=../apiExamples/minNumeric.html) -->
<!-- AURO-GENERATED-CONTENT:START (FILE:src=../apiExamples/minNumber.html) -->
<!-- AURO-GENERATED-CONTENT:END -->
</div>

<auro-accordion alignRight>
<span slot="trigger">See code</span>

<!-- AURO-GENERATED-CONTENT:START (CODE:src=../apiExamples/minNumeric.html) -->
<!-- AURO-GENERATED-CONTENT:START (CODE:src=../apiExamples/minNumber.html) -->
<!-- AURO-GENERATED-CONTENT:END -->

</auro-accordion>
Expand Down
24 changes: 12 additions & 12 deletions components/input/src/base-input.js
Original file line number Diff line number Diff line change
Expand Up @@ -36,9 +36,9 @@ import AuroFormValidation from '@auro-formkit/form-validation';
* @attr {String} isValid - (DEPRECATED - Please use validity) Can be accessed to determine if the input validity. Returns true when validity has not yet been checked or validity = 'valid', all other cases return false. Not intended to be set by the consumer.
* @attr {String} label - Deprecated, see `slot`.
* @attr {String} lang - defines the language of an element.
* @attr {String} max - The maximum value allowed. This only applies for inputs with a type of `numeric` and all date formats.
* @attr {String} max - The maximum value allowed. This only applies for inputs with a type of `number` and all date formats.
* @attr {Number} maxLength - The maximum number of characters the user can enter into the text input. This must be an integer value `0` or higher.
* @attr {String} min - The minimum value allowed. This only applies for inputs with a type of `numeric` and all date formats.
* @attr {String} min - The minimum value allowed. This only applies for inputs with a type of `number` and all date formats.
* @attr {Number} minLength - The minimum number of characters the user can enter into the text input. This must be an non-negative integer value smaller than or equal to the value specified by `maxlength`.
* @attr {String} name - Populates the `name` attribute on the input.
* @attr {Boolean} noValidate - If set, disables auto-validation on blur.
Expand Down Expand Up @@ -247,7 +247,7 @@ export default class BaseInput extends LitElement {
delimiter: ''
};

this.inputMode = 'numeric';
this.inputMode = 'number';

break;

Expand All @@ -256,7 +256,7 @@ export default class BaseInput extends LitElement {
creditCard: true
};

this.inputMode = 'numeric';
this.inputMode = 'number';

break;

Expand All @@ -271,7 +271,7 @@ export default class BaseInput extends LitElement {
]
};

this.inputMode = 'numeric';
this.inputMode = 'number';

break;

Expand All @@ -286,7 +286,7 @@ export default class BaseInput extends LitElement {
]
};

this.inputMode = 'numeric';
this.inputMode = 'number';

break;

Expand All @@ -299,7 +299,7 @@ export default class BaseInput extends LitElement {
]
};

this.inputMode = 'numeric';
this.inputMode = 'number';

break;

Expand All @@ -312,7 +312,7 @@ export default class BaseInput extends LitElement {
]
};

this.inputMode = 'numeric';
this.inputMode = 'number';

break;

Expand All @@ -322,7 +322,7 @@ export default class BaseInput extends LitElement {
datePattern: ['Y']
};

this.inputMode = 'numeric';
this.inputMode = 'number';

break;

Expand All @@ -332,7 +332,7 @@ export default class BaseInput extends LitElement {
datePattern: ['y']
};

this.inputMode = 'numeric';
this.inputMode = 'number';

break;

Expand All @@ -342,7 +342,7 @@ export default class BaseInput extends LitElement {
datePattern: ['m']
};

this.inputMode = 'numeric';
this.inputMode = 'number';

break;

Expand Down Expand Up @@ -608,7 +608,7 @@ export default class BaseInput extends LitElement {
* @return {void}
*/
handleInput() {
// Prevent non-numeric characters from being entered on credit card fields.
// Prevent non-number characters from being entered on credit card fields.
if (this.type === 'credit-card') {
this.inputElement.value = this.inputElement.value.replace(/[\D]/gu, '');
}
Expand Down
2 changes: 1 addition & 1 deletion packages/form-validation/src/validation.js
Original file line number Diff line number Diff line change
Expand Up @@ -59,7 +59,7 @@ export default class AuroFormValidation {
elem.validity = 'tooShort';
elem.setCustomValidity = elem.setCustomValidityForType || '';
}
} else if (elem.type === 'number' || elem.type === 'numeric') { // 'numeric` is a deprecated alias for number'
} else if (elem.type === 'number') {
if (elem.max !== undefined && Number(elem.max) < Number(elem.value)) {
elem.validity = 'rangeOverflow';
elem.setCustomValidity = elem.getAttribute('setCustomValidityRangeOverflow') || '';
Expand Down

0 comments on commit 419d8ae

Please sign in to comment.