Gathering detailed insights and metrics for vuetify-numeric
Installations
npm install vuetify-numericDeveloper Guide
BETA
Typescript
No
Module System
CommonJS
Node Version
12.22.9
NPM Version
8.5.1
Releases
Unable to fetch releases
Contributors
4
Unable to fetch Contributors
Languages
5
TypeScript
Vue
HTML
JavaScript
Shell
TypeScript (70.93%)
Vue (18.73%)
HTML (5.22%)
JavaScript (4.65%)
Shell (0.47%)
Love this project? Help keep it running — sponsor us today! 🚀
Developer
kolesnikovav
Download Statistics
Total Downloads
28,426
Last Day
2
Last Week
2
Last Month
423
Last Year
7,395
GitHub Statistics
23 Stars
123 Commits
8 Forks
4 Watching
16 Branches
4 Contributors
Bundle Size
524.55 kB
Minified
63.83 kB
Minified + Gzipped
Maintainers
1
Package Meta Information
Latest Version
0.2.1
Package Id
vuetify-numeric@0.2.1
Unpacked Size
1.00 MB
Size
246.21 kB
File Count
9
NPM Version
8.5.1
Node Version
12.22.9
Total Downloads
Cumulative downloads
Total Downloads
28,426
Last day
0%
2
Compared to previous day
Last week
-97.1%
2
Compared to previous week
Last month
-1.2%
423
Compared to previous month
Last year
4.5%
7,395
Compared to previous year
Daily Downloads
Weekly Downloads
Monthly Downloads
Yearly Downloads
Dev Dependencies
24
@types/jest@typescript-eslint/eslint-plugin@typescript-eslint/parser@vue/cli-plugin-babel@vue/cli-plugin-eslint@vue/cli-plugin-typescript@vue/cli-plugin-unit-jest@vue/cli-service@vue/eslint-config-standard@vue/eslint-config-typescript@vue/test-utilseslinteslint-plugin-importeslint-plugin-nodeeslint-plugin-promiseeslint-plugin-standardeslint-plugin-vuenode-sasssasssass-loadertypescriptvue-cli-plugin-vuetifyvue-template-compilervuetify-loader
Versions
vuetify-numeric
Numeric input components for use with vuetifyjs.
Features
- Built-in calculator
- Smart numeric input
- Locale support number format
- Adjustable text color
- Groupping digits
- Right number alignement
- Show prefix (currency ...) near your number
- No thirdpatry solutions is used
- Vuetify VTextField compatible
Keyboard shortcuts
| Key | Action |
|---|---|
| Enter | Activate calculator or calculate your expression and close the calculator. (Note) You can change calculator's activation key |
| Delete | Reset calculator |
| . or , | Swich your input between integer and fraction part of number |
| - | Change your input number sign |
Demo & Playground
See Live demo . or Codesandbox example codesandbox
The v-numeric component
The component extends the Vuetify v-text-field component.
How to use
Install the package:
yarn add vuetify-numeric
Add the package to your app entry point:
import VNumeric from 'vuetify-numeric/vuetify-numeric.umd.min'
Or (in develop case)
import VNumeric from 'vuetify-numeric/vuetify-numeric.umd'
Than, register this plugin
Vue.use(VNumeric)
Once the plugin has been installed, you can now use the v-numeric component in your templates.
Use v-model to bind to the value.
<template>
<v-numeric text outlined v-model="amount"></v-numeric>
</template>
<script>
export default {
data() {
return {
amount: 0,
};
},
};
</script>
Props:
| Prop | description | type | default |
|---|---|---|---|
| min | Sets minimum value | Number | - Number.MAX (infinity) |
| max | Sets maximum value | Number | Number.MAX (infinity) |
| length | Sets maximum number of digits | Number | 10 |
| precision | Number of digits after decimal point | Number | 0 |
| negativeTextColor | Text color when number is negative | String | red |
| locale | Current locale | String | en-US |
| useGrouping | use grouping digits | Boolean | true |
| elevation | Sets the calculator elevation | Number | 10 |
| fab | FAB-kind calculator's button | Boolean | false |
| text | use transparent background in calculator | Boolean | false |
| calcStyle | You can customize calculator's button style separately from input field. This is not mandatory. | object | undefined |
| calcIcon | You can customize calculator's icon. If it's undefined, the calculator icon does not appear. | string | 'mdi-calculator' |
| useCalculator | Turn on/off calculator usage. | boolean | true |
| openKey | Key for open build-in calculator | String | 'Enter' |
| calcNoTabindex | Set or not tabindex attribute in calc icon | Boolean | false |
calcStyle object properties:
This object uses for customizing calculator buttons, and consist of the same Vuetify v-btn properies. For details, see official documentation
calcStyle: {
fab: false,
outlined: false,
rounded: false,
text: false,
tile: false,
large: false,
small: false
}
Anover props are derived from v-text-field component
Events:
@input: Emitted when value is changed after user input.
@change: Emitted formatted value as string when that is changed after user input.
CDN example:
You can use this library without installation, via cdn provider
<!DOCTYPE html>
<html>
<head>
<link href="https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900" rel="stylesheet">
<link href="https://cdn.jsdelivr.net/npm/@mdi/font@4.x/css/materialdesignicons.min.css" rel="stylesheet">
<link href="https://cdn.jsdelivr.net/npm/vuetify@2.x/dist/vuetify.min.css" rel="stylesheet">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no, minimal-ui">
</head>
<body>
<div id="app">
<v-app>
<v-main>
<v-container>
<v-row>
<v-numeric text outlined ></v-numeric>
</v-row>
<v-row>
<v-numeric text ></v-numeric>
</v-row>
</v-container>
</v-main>
</v-app>
</div>
<script src="https://cdn.jsdelivr.net/npm/vue@2.x/dist/vue.js"></script>
<script src="https://cdn.jsdelivr.net/npm/vuetify@2.x/dist/vuetify.js"></script>
<script src="https://cdn.jsdelivr.net/npm/vuetify-numeric@0.2.x/vuetify-numeric.umd.min.js"></script>
<script>
new Vue({
el: '#app',
vuetify: new Vuetify({})
})
</script>
</body>
</html>
No vulnerabilities found.
Reason
no binaries found in the repo
Reason
no dangerous workflow patterns detected
Reason
license file detected
Details
- Info: project has a license file: LICENSE:0
- Info: FSF or OSI recognized license: MIT License: LICENSE:0
Reason
Found 1/2 approved changesets -- score normalized to 5
Reason
dependency not pinned by hash detected -- score normalized to 3
Details
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/node.js.yml:23: update your workflow using https://app.stepsecurity.io/secureworkflow/kolesnikovav/vuetify-numeric/node.js.yml/master?enable=pin
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/node.js.yml:25: update your workflow using https://app.stepsecurity.io/secureworkflow/kolesnikovav/vuetify-numeric/node.js.yml/master?enable=pin
- Info: 0 out of 2 GitHub-owned GitHubAction dependencies pinned
- Info: 1 out of 1 npmCommand dependencies pinned
Reason
detected GitHub workflow tokens with excessive permissions
Details
- Warn: no topLevel permission defined: .github/workflows/node.js.yml:1
- Info: no jobLevel write permissions found
Reason
0 commit(s) and 0 issue activity found in the last 90 days -- score normalized to 0
Reason
no effort to earn an OpenSSF best practices badge detected
Reason
security policy file not detected
Details
- Warn: no security policy file detected
- Warn: no security file to analyze
- Warn: no security file to analyze
- Warn: no security file to analyze
Reason
project is not fuzzed
Details
- Warn: no fuzzer integrations found
Reason
branch protection not enabled on development/release branches
Details
- Warn: branch protection not enabled for branch 'master'
Reason
SAST tool is not run on all commits -- score normalized to 0
Details
- Warn: 0 commits out of 29 are checked with a SAST tool
Reason
71 existing vulnerabilities detected
Details
- Warn: Project is vulnerable to: GHSA-67hx-6x53-jw92
- Warn: Project is vulnerable to: GHSA-93q8-gq69-wqmw
- Warn: Project is vulnerable to: GHSA-qwcr-r2fm-qrc7
- Warn: Project is vulnerable to: GHSA-grv7-fg5c-xmjg
- Warn: Project is vulnerable to: GHSA-x9w5-v3q2-3rhw
- Warn: Project is vulnerable to: GHSA-pxg6-pf52-xh8x
- Warn: Project is vulnerable to: GHSA-3xgq-45jj-v275
- Warn: Project is vulnerable to: GHSA-phwq-j96m-2c2q
- Warn: Project is vulnerable to: GHSA-ghr5-ch3p-vcr6
- Warn: Project is vulnerable to: GHSA-434g-2637-qmqr
- Warn: Project is vulnerable to: GHSA-49q7-c7j4-3p7m
- Warn: Project is vulnerable to: GHSA-977x-g7h5-7qgw
- Warn: Project is vulnerable to: GHSA-f7q4-pwc6-w24p
- Warn: Project is vulnerable to: GHSA-fc9h-whq2-v747
- Warn: Project is vulnerable to: GHSA-rv95-896h-c2vc
- Warn: Project is vulnerable to: GHSA-qw6h-vgh9-j6wx
- Warn: Project is vulnerable to: GHSA-jchw-25xp-jwwc
- Warn: Project is vulnerable to: GHSA-cxjh-pqwp-8mfp
- Warn: Project is vulnerable to: GHSA-pfq8-rq6v-vf5m
- Warn: Project is vulnerable to: GHSA-c7qv-q95q-8v27
- Warn: Project is vulnerable to: GHSA-78xj-cgh5-2h22
- Warn: Project is vulnerable to: GHSA-2p57-rm9w-gvfp
- Warn: Project is vulnerable to: GHSA-9c47-m6qq-7p4h
- Warn: Project is vulnerable to: GHSA-76p3-8jx3-jpfq
- Warn: Project is vulnerable to: GHSA-3rfm-jhwj-7488
- Warn: Project is vulnerable to: GHSA-hhq3-ff78-jv3g
- Warn: Project is vulnerable to: GHSA-952p-6rrq-rcjv
- Warn: Project is vulnerable to: GHSA-5rrq-pxf6-6jx5
- Warn: Project is vulnerable to: GHSA-8fr3-hfg3-gpgp
- Warn: Project is vulnerable to: GHSA-gf8q-jrpm-jvxq
- Warn: Project is vulnerable to: GHSA-2r2c-g63r-vccr
- Warn: Project is vulnerable to: GHSA-cfm4-qjh2-4765
- Warn: Project is vulnerable to: GHSA-x4jg-mjrx-434g
- Warn: Project is vulnerable to: GHSA-5fw9-fq32-wv5p
- Warn: Project is vulnerable to: GHSA-r8f7-9pfq-mjmv
- Warn: Project is vulnerable to: GHSA-rp65-9cf3-cjxr
- Warn: Project is vulnerable to: GHSA-9wv6-86v2-598j
- Warn: Project is vulnerable to: GHSA-rhx6-c78j-4q9w
- Warn: Project is vulnerable to: GHSA-7fh5-64p2-3v2j
- Warn: Project is vulnerable to: GHSA-p8p7-x288-28g6
- Warn: Project is vulnerable to: GHSA-7mwh-4pqv-wmr8
- Warn: Project is vulnerable to: GHSA-c2qf-rxjj-qqgw
- Warn: Project is vulnerable to: GHSA-m6fv-jmcg-4jfg
- Warn: Project is vulnerable to: GHSA-cm22-4g7w-348p
- Warn: Project is vulnerable to: GHSA-3jfq-g458-7qm9
- Warn: Project is vulnerable to: GHSA-5955-9wpr-37jh
- Warn: Project is vulnerable to: GHSA-f5x3-32g6-xq36
- Warn: Project is vulnerable to: GHSA-72xf-g2v4-qvf3
- Warn: Project is vulnerable to: GHSA-7p7h-4mm5-852v
- Warn: Project is vulnerable to: GHSA-5j4c-8p2g-v4jx
- Warn: Project is vulnerable to: GHSA-g3ch-rx76-35fx
- Warn: Project is vulnerable to: GHSA-wr3j-pwj9-hqq6
- Warn: Project is vulnerable to: GHSA-j8xg-fqg3-53r7
- Warn: Project is vulnerable to: GHSA-3h5v-q93c-6h6q
- Warn: Project is vulnerable to: GHSA-p9pc-299p-vxgp
- Warn: Project is vulnerable to: GHSA-whgm-jr23-g3j9
- Warn: Project is vulnerable to: GHSA-gxpj-cx7g-858c
- Warn: Project is vulnerable to: GHSA-ww39-953v-wcq6
- Warn: Project is vulnerable to: GHSA-7wwv-vh3v-89cq
- Warn: Project is vulnerable to: GHSA-7r28-3m3f-r2pr
- Warn: Project is vulnerable to: GHSA-r8j5-h5cx-65gg
- Warn: Project is vulnerable to: GHSA-896r-f27r-55mw
- Warn: Project is vulnerable to: GHSA-vh95-rmgr-6w4m
- Warn: Project is vulnerable to: GHSA-xvch-5gv4-984h
- Warn: Project is vulnerable to: GHSA-92xj-mqp7-vmcj
- Warn: Project is vulnerable to: GHSA-wxgw-qj99-44c2
- Warn: Project is vulnerable to: GHSA-hxcc-f52p-wc94
- Warn: Project is vulnerable to: GHSA-g4rg-993r-mgx7
- Warn: Project is vulnerable to: GHSA-29xr-v42j-r956
- Warn: Project is vulnerable to: GHSA-6fc8-4gx4-v693
- Warn: Project is vulnerable to: GHSA-c4w7-xm78-47vh
Score
3.2
/10
Last Scanned on 2025-02-03
The Open Source Security Foundation is a cross-industry collaboration to improve the security of open source software (OSS). The Scorecard provides security health metrics for open source projects.
Learn More