Gathering detailed insights and metrics for wc-air-datepicker
Gathering detailed insights and metrics for wc-air-datepicker
Gathering detailed insights and metrics for wc-air-datepicker
Gathering detailed insights and metrics for wc-air-datepicker
Wrapper around air-datepicker to be used as a web component
npm install wc-air-datepicker
Typescript
Module System
Node Version
NPM Version
76.1
Supply Chain
86
Quality
75.4
Maintenance
100
Vulnerability
100
License
JavaScript (66.95%)
CSS (21.5%)
TypeScript (8.65%)
HTML (2.9%)
Total Downloads
8,439
Last Day
2
Last Week
3
Last Month
17
Last Year
305
MIT License
9 Stars
20 Commits
4 Forks
1 Watchers
1 Branches
2 Contributors
Updated on Feb 17, 2022
Minified
Minified + Gzipped
Latest Version
0.3.0
Package Id
wc-air-datepicker@0.3.0
Unpacked Size
425.12 kB
Size
119.57 kB
File Count
31
NPM Version
5.6.0
Node Version
8.11.3
Cumulative downloads
Total Downloads
Last Day
0%
2
Compared to previous day
Last Week
200%
3
Compared to previous week
Last Month
-69.1%
17
Compared to previous month
Last Year
-44.7%
305
Compared to previous year
<air-datepicker>
Air DatePicker is a really awesome date picker. While the actual library is written using jQuery, I sometimes find it difficult to use inside modern libraries. That's why this project exist. It's a little wrapper around AirDatePicker which gives a simple web component and you can use it inside your vanilla, React, Vue, (...) application.
You can use NPM
or Yarn
to install the component
1npm install --save wc-air-datepicker
Now just include one Javascript and you're done
1<script src="node_modules/air-datepicker/dist/air-datepicker.js"></script>
Or you can check this page which guides how to plug it inside a framework of choice.
We have made some changes to the component here are all of them
🔤 English is default language instead of Russian
🔌 Automatically loading jQuery if it's not already loaded.
💅 Added custom properties to make styling a little bit easier
I am open to suggestion and improvements, open an issue or submit a PR if you would like to improve the project!
You can change some colors using custom properties. I haven't invested into making every single color available here, just the ones that seems reasonable to have. If you need more colors you can always open an issue or submit a PR.
1 :root { 2 --air-datepicker--day-name: #ff9a19; 3 --air-datepicker--current: #4eb5e6; 4 --air-datepicker--selected: #5cc4ef; 5 --air-datepicker--selected-focus: #45bced; 6 }
1 <air-datepicker> 2 <input /> <!-- We will attach date picker on the first input field --> 3 </air-datepicker>
1 <air-datepicker timepicker="true"> 2 <input /> 3 </air-datepicker>
You can set all of your customizations on <air-datepicker>
tag, for the full list of available customizations go to this page.
No vulnerabilities found.
Reason
no binaries found in the repo
Reason
license file detected
Details
Reason
Found 1/19 approved changesets -- score normalized to 0
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
Reason
project is not fuzzed
Details
Reason
branch protection not enabled on development/release branches
Details
Reason
SAST tool is not run on all commits -- score normalized to 0
Details
Reason
90 existing vulnerabilities detected
Details
Score
Last Scanned on 2025-03-17
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