# kdu-numeric-input

> Kdu Numeric Input Component

Latest version **1.0.6-alpha.0** (published 2022-09-19) · MIT license · 0 weekly downloads

## Install

```sh
npm install kdu-numeric-input
pnpm add kdu-numeric-input
yarn add kdu-numeric-input
bun add kdu-numeric-input
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.6-alpha.0 |
| Published | 2022-09-19 |
| First published | 2022-09-19 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Node | >= 6.0.0 |
| Dependencies | 0 |
| Unpacked size | 69.9 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 0 |
| Author | NKDuy |
| Maintainers | nkduy |
| Keywords | input, text, component, number, numeric, kdu |

## Links

- npm: https://www.npmjs.com/package/kdu-numeric-input
- Repository: https://github.com/khanhduy1407/kdu-numeric-input
- Homepage: https://github.com/khanhduy1407/kdu-numeric-input/#readme
- Issues: https://github.com/khanhduy1407/kdu-numeric-input/issues
- npm.io page: https://npm.io/package/kdu-numeric-input

## Alternatives

- [random-seedable](https://npm.io/package/random-seedable.md) — 27.9K weekly downloads
- [n2words](https://npm.io/package/n2words.md) — 22.2K weekly downloads
- [@stdlib/math-base-special-factorialln](https://npm.io/package/@stdlib/math-base-special-factorialln.md) — 5.7K weekly downloads
- [@stdlib/math-base-special-abs2](https://npm.io/package/@stdlib/math-base-special-abs2.md) — 1.7K weekly downloads
- [commons-math-interpolation](https://npm.io/package/commons-math-interpolation.md) — 1.4K weekly downloads

## Recent versions

- 1.0.6-alpha.0 (latest) — 2022-09-19

## README

# Kdu Numeric Input

Number input component based on Kdu that is a replacement of native input number with optional control.

![kdu-numeric-input](https://user-images.githubusercontent.com/36194663/44717643-33e4ea00-aadb-11e8-82bf-e1fdeeea3bb5.gif)

### Installation

Install via NPM

`$ npm install kdu-numeric-input --save`

Install via CDN

```html
<script src="https://unpkg.com/kdu"></script>
<script src="https://unpkg.com/kdu-numeric-input"></script>
```

#### Global

Register KduNumericInput globally:

```javascript
import Kdu from 'kdu';
import KduNumericInput from 'kdu-numeric-input';

Kdu.use(KduNumericInput)
```

#### Local

Include the KduNumericInput  directly into your component using import:

```javascript
import KduNumericInput from 'kdu-numeric-input'

export default {
  components: {
    KduNumericInput
  }
}
```
### Usage

#### Basic usage

```html
<template>
  <div>
    <kdu-numeric-input  k-model="value" :min="1" :max="10" :step="2"></kdu-numeric-input>
  </div>
</template>

<script>
  export default {
    data() {
      return {
        value: 1,
      };
    },
  };
</script>
```

#### PROPS:

| Name             | Description                 |  Type         |  Default     | Options       |
| -----------      | ---------------             | ------------  | ------------ | ------------  |
|  name            |  Component name             | String        |     -        |      -        |
|  value           |  Binding value              | Number        |     -        |      -            |
|  placeholder     |  Input placeholder          | String        |     -        |      -         |
|  min             |  Minimum allowed value      | Number        |  -Infinity   |      -        |
|  max             |  Maximum allowed value      | Number        |   Infinity   |      -          |
|  step            |  Incremental Step           | Number        |      1       |      -          |
|  align           |  Alignment of Numeric Value | String        |     left     | left, center, right |
|  size            |  Component Size             | String        |   Inherit    | size in px, em, rem etc e.g. '20px'          |
|  precision       |  Number of decimals         | Number        |      0       |   Integer value|
|  controls        |  Enable/Disable Controls    | Boolean       |    true      |   true/false|
|  controlsType    |  Controls Type              | String        |  plusminus   |   plusminus/updown|
|  autofocus       |  Autofocus on Page Load     | Boolean       |    false     |   true/false|
|  readonly        |  Is Readonly                | Boolean       |    false     |   true/false|
|  disabled        |  Is Disabled                | Boolean       |    false     |   true/false|


#### EVENTS:

Event Name | Description        | Parameters
-----------|--------------------|--------------
input      | triggers when input| (newValue)
change     | triggers when the value changes| (newValue)
blur       | triggers when Input blurs| (event: Event)
focus      | triggers when Input focus| (event: Event)


#### METHODS:

Method | Description | Parameters
---|--- | ----
focus | focus the Input component| -
blur | blur the Input component| -

## License

MIT

---
_Source: https://npm.io/package/kdu-numeric-input · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._